Question

所以我有2页。 transfer.php和display_guide.php。我使用AJAX请求调用display_guide.php在tranfer.php上显示它。 display_guide.php上有一个简单的切换功能，当我单独测试时，它可以正常工作。但是，当使用AJAX调用在transfer.php上时，切换功能不起作用。任何帮助将不胜感激。

我查看了其他文章，他们都建议我使用.on方法，我已经这样做了。一些辅助信息：我正在使用Bootstrap，但即使我注释掉bootstrap链接，错误仍然存在 - 因此它无法进行自举。

display_guide.php的代码如下：

<body>
<!-- GENED TABLE WITH CATEGORY IMPLEMENTATION----------------------------------->

<button id="sri">Toggle between hiding and showing the paragraphs</button>
<p>This is another small paragraph.</p>

<script>
    $(document).on("click", "button", function(){
        $("p").toggle();
    });
</script>
</body>

但是，当我希望这个切换反映在transfer.php中时，我遇到了问题。内容加载但是当我点击按钮时它拒绝切换。它不模仿独立页面的行为（display_guide.php）。

Answer 1

将您的切换代码移到transfer.php文件内的ajax回调中，以便在追加html后将事件附加到对象。

      function loadTransferGuide(str3) {
        var xhttp3 = new XMLHttpRequest();
        xhttp3.onreadystatechange = function() {
            if (xhttp3.readyState == 4 && xhttp3.status == 200) {
                document.getElementById("transfer_guide").innerHTML = xhttp3.responseText;
                $(document).on("click", "button", function(){
                     $("p").toggle();
                });
            }
        };
        xhttp3.open("GET", "display_guide.php", true);
        xhttp3.send();
    }

JQuery没有处理AJAX请求

1 个答案: