如何使用jQuery将DIV的内部HTML更改为PHP文件的输出

How do I change inner HTML of a DIV to the output of a PHP file using jQuery

我正在学习php和jquery。我有一个名为renderpicture.php的php文件,它返回一个HTML img标记中动态创建的图像。我想在我的网页上单击事件之后更改那个图像——而不需要重新加载页面。我知道我需要一个jQueryAjax调用来呈现图片。我知道我需要将DIV的内部HTML设置为jquery ajax调用的结果。我在这里学习了如何设置内部HTML,如何使用jquery替换DIV的innerHTML?但我不太确定如何使用Ajax调用来实现这一点。

如何使用jquery将DIV的内部HTML设置为PHP文件的输出?

以下是jquery和一些HTML:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$(document).ready(function(){
   $("#myDIV").click(function(){
        //var resultOfAjaxCall = $.ajax({ url: './renderPicture.php',});
        $("#myDIV").html(resultOfAjaxCall); //This is roughly what I want to do
    });
});



</head>

<?php
$cryptinstall="./renderPicture.php";
include $cryptinstall;
?>

</html>

这是renderpicture.php

1
2
3
4
5
6
7
8
9
10
<?php

$cryptinstall="./cryptographp.fct.php";
include $cryptinstall;
if(session_id() =="") session_start();
$_SESSION['cryptdir']= dirname($cryptinstall);
$cfg=0;
echo"<img id='cryptogram' src='".$_SESSION['cryptdir']."/cryptographp.php?cfg=".$cfg."&".SID."'>";
 ren
?>

使用.load()

1
2
3
4
5
$(document).ready(function(){
   $("#myDIV").click(function(){
        $("#myDIV").load('renderPicture.php');
    });
});

以下简称:

1
2
3
4
5
6
7
8
9
10
$(document).ready(function(){
   $("#myDIV").click(function(){
        $.ajax({
            url: './renderPicture.php',
            success: function(resultOfAjaxCall) {
                $("#myDIV").html(resultOfAjaxCall);
            }
        });
    });
});

每当您想对Ajax调用的结果做一些事情时,都必须在回调函数中进行。


使用jQuery.get()发出Ajax请求。

1
2
3
4
$.get('ajax/test.html', function(data) {
  $('#myDIV').html(data);
  alert('Load was performed.');
});


如果我猜对了,你需要加载()。

Load data from the server and place the returned HTML into the matched element.

1
  $("#myDIV").load('qualifiedFilePath');