jQuery加载事件

Question

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

我使用jQuery函数，如下所示：

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

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

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

但是，当页面重新加载时，悬停也会重新加载，并且jQuery的.show方法hide会使所有隐藏的div可见。有没有办法防止悬停重新加载，并且每次调用.load函数时，可见的隐藏div都保持可见。

我使用的点击和悬停函数如下：

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

和

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

任何帮助都是非常感谢的。

Answer 1

现在不推荐使用jQuery.live。所以不要用它。从现在开始使用jQuery.on。此外，.hover事件正在被删除。您应该使用单独的mouseenter和mouseleave事件。

可以通过将.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设置状态

Answer 2

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

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

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