Question

我正在尝试刷新部分php页面而不使用函数load（）重新加载整个页面。之前已经问过这个问题，我已经尝试了我找到的所有解决方案。

我第一次点击<a class="remove" href="...>时效果很好，但是在第二次点击时会重新加载整个页面，等等...

这是我在这里的第一篇文章，但我希望我的解释清楚。这是js：

$( document ).ready(function() {
$(".remove").on('click', function(event){
    var url = $(this).attr('href') ;
    event.preventDefault();

    $('#containerWrapper').load(url + " #containerWrapper");
});
});

提前谢谢！

Answer 1

您的代码将重新加载整个页面，因为.remove元素是#containerWrapper的子元素。您需要将事件委托给此级别，否则所有绑定事件都将丢失：

$(document).ready(function () {
    $('#containerWrapper').on('click', ".remove", function (event) {
        var url = this.href;
        event.preventDefault();    
        $('#containerWrapper').load(url + " #containerWrapper");
    });
});

Answer 2

首先，这是y建议使用

$(window).bind("load", function() {
//your codes here
});

而不是$(document).ready()
我使用了一些与你的完全一样的代码，效果很好。但只有一个区别！

$(".remove").on('click', function(event){
    var url = $(this).attr('href') ;
   $('#containerWrapper').load(url + " #inner");
 event.preventDefault();
});

我最终放了prevent！我已在#inner内加载#containerWrapper 网址标记：

<div id="containerWrapper">
   <div id="inner">
   </div>
</div>

jQuery函数load重新加载整个页面

2 个答案: