jQuery加载事件


jQuery load events

我有一个来自PHP的动态内容页面,我想使用jQuery的加载函数来定期刷新包含动态内容的div容器,以便新内容显示在旧内容的顶部

我使用jQuery函数如下:

setInterval(function() {                         
    $("#ContentWrapper").load("Livefeed.php #ContentWrapper");
}, 10000);

每10秒刷新一次内容容器的包装器

我的问题是加载函数执行后。单击事件和悬停事件在页面上不能正常工作。最初它们根本没有触发,所以我在内容包装器中的所有点击和悬停事件上使用了Jquery live函数,它解决了这个问题。

但是,当页面重新加载时,悬停也会重新加载,所有隐藏的div都可以通过jQuery的。show方法hide显示。是否有任何方法来防止悬停从重新加载,也为可见的隐藏div保持可见,每次调用。load函数。

我使用点击和悬停功能,像这样:

$('selector').live("click",function(){
});

$('selector').live("hover",function(){
});

使用jQuery。Live现在已弃用。所以不要用它。使用jQuery。从现在开始。同时,。hover事件正在被取消。应该使用单独的mouseenter和mouselleave事件。

你可以通过用:

替换。live来解决这个问题
/*
If click happens inside contentwrapper, check if click target was yourSelector, if true execute this function
*/
    $("#ContentWrapper").on("click", "#yourSelector", function(){
     //do whatever u wanna do on click
    });

跟踪所有div隐藏和所有那些不是你需要为每个div设置唯一的id。在你用。load()重新加载之前,你循环遍历所有div并保存他们的当前状态(隐藏或可见)在一个对象数组[{id: state},…)的格式。ajax请求完成后,通过$.map循环遍历对象数组,并为每个div

设置状态

你可以使用JQuery委托,它的主要目的是动态驱动内容:

http://api.jquery.com/delegate/

 $("#Parent").delegate("selector","click", function() { });