Javascript AJAX调用后通过JS打印HTML

假设我有3个PHP页面

• Page1是用户正在查看的页面
• 第2页包含在第1页，该列表列出了项目，并且在每个项目旁边都有一个删除按钮
• Page3是我的解析文件，我通过AJAX向其发送信息以更新数据库 不离开/刷新页面

我将所有数据发送到第三个PHP文件的JS如下：

$(".delete").bind("click", function() {
    var id = event.target.id;
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function(){
        if(this.readyState == 4 && this.status == 200){
            console.log(this.responseText);

            //document.getElementById("message").innerHTML = 'deleted';
            //$("#message").html('deleted');
        }
    };
    xmlhttp.open("POST", "page3.php?delete="+id, true);
    xmlhttp.send();
});

这很好，我可以在控制台中看到返回的内容，但我无法添加消息。消息div位于第2页

---

我认为发生这种情况的唯一原因是page1中包含了page2，尽管DOM中存在div，并且我在控制台中没有收到JS错误，说找不到div。

您缺少检查页面是否已加载

window.onload = function(){
    document.getElementById("message").innerHTML = 'deleted';
}

或

---

通过重新设计并将div放在第1页上，解决了这个问题

---

仍然不能完全确定为什么它不能在包含的页面上工作，但这肯定是原因。

如果您的标记是正确的，我看不出为什么div消息不会被更改。它可能是通过

zIndex

，

显示

，或

可见性

属性隐藏的吗？@zfrisch谢谢你的评论，没有，我实际上是在检查元素以确保。在做了一些测试之后，当message div在page1上时，它就工作了，所以我认为这一定与它的包含方式有关。是否有多个元素具有相同的id？page2是如何包含在page1中的？@epascarello感谢您的评论，不，只有一个div具有该id。它是这样包含的：

不，情况并非如此。我的整个JS被包装在

$（document）.ready（function（）{…}

中，包括上面的整个函数下一个建议-确保消息div可见。请参阅前面的注释。消息正在编写中，但您无法看到它，因为包含消息的元素已隐藏。

$( document ).ready(function() {
    $("#message").html('deleted');
});