dtz46697 2016-08-31 06:43
浏览 62
已采纳

JQuery没有处理AJAX请求

So I have 2 pages. transfer.php and display_guide.php. I call display_guide.php using an AJAX Request to display it on tranfer.php. There is a simple toggle function on display_guide.php and it works just fine when I test it alone. However the toggle function does not work when on transfer.php using the AJAX Call. Any help would be greatly appreciated.

I have looked on other articles and they all suggested that I use the .on method and I have done so. Some side information: I am using Bootstrap, but even when I comment out the bootstrap link, the error persists -- so it can't be bootstrap.

The code for display_guide.php is as follows:

<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>

However, when I want this toggle to be reflected in transfer.php, I have issues. The content loads but it refuses to toggle when I click on the button. It does not mimic the behavior of the standalone page (display_guide.php).

  • 写回答

1条回答 默认 最新

  • doushi1473 2016-08-31 06:47
    关注

    Move your toggle code inside ajax callback inside transfer.php file, to attach event to object after the html has been appended.

          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();
        }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 Workbench中材料库无法更新,如何解决?
  • ¥20 如何推断此服务器配置
  • ¥15 关于github的项目怎么在pycharm上面运行
  • ¥15 内存地址视频流转RTMP
  • ¥100 有偿,谁有移远的EC200S固件和最新的Qflsh工具。
  • ¥15 有没有整苹果智能分拣线上图像数据
  • ¥20 有没有人会这个东西的
  • ¥15 cfx考虑调整“enforce system memory limit”参数的设置
  • ¥30 航迹分离,航迹增强,误差分析
  • ¥15 Chrome Manifest扩展引用Ajax-hook库拦截请求失败