0

我在页面上有一个元素，单击该元素会对文件发出 ajax 请求receiver.php：

<script>
function send(id){
    $.ajax({
        type: 'POST',
        dataType: 'html',
        url: 'receiver.php',
        data: {id: id}
    });
}
</script>

<img src="foo.bar" onclick="send(id)"/> <!-- simplified -->

我的想法是这个receiver.php文件将接收id，然后基于它输出一整页的 HTMLid

但是，当我单击该元素时，我期望的新 HTML 页面不会出现。当我转到 Chrome 检查器的“网络”选项卡时，我可以看到请求，并且响应正是我需要的 HTML 内容，但为什么它不更改为新页面并保留在旧页面上呢？

编辑：这是我的receiver.php，用于测试目的：

<html>
<head></head>
<body>
    <?php
        echo "<p>".$_POST['comid']."</p>";
        echo "<p> foo foo </p>";
    ?>
</body>
</html>

这是回应：

<html>
<head></head>
<body>
    <p>3</p><p> foo foo </p>    </body>
</html>
4

2 回答 2

3

您必须对 AJAX 调用返回的结果进行处理：

function send(id){
    $.ajax({
        type: 'POST',
        dataType: 'html',
        url: 'receiver.php',
        data: {id: id},
        success: function(data){
             console.log(data);
        }
    });
}
于 2013-08-10T19:49:53.700 回答
3

也许在您的receiver.php脚本中您正在执行类似的操作，您可以根据接收到的 id 确定要输出的 HTML 页面。

switch ($_POST['id']) {
case 'foo':
    $filepath = 'bar';
    break;

    ...
}

readfile($filepath);

您必须在 AJAX 查询中反映success这一点，使用$.ajax.

function send(id) {
    $.ajax({
        type: 'POST',
        dataType: 'html',
        url: 'receiver.php',
        data: {id: id},
        success: function (data) {
            // Replace the whole body with the new HTML page
            var newDoc = document.open('text/html', 'replace');
            newDoc.write(data);
            newDoc.close();
        }
    });
}
于 2013-08-10T19:52:26.950 回答