jQuery 加载事件答案

【问题标题】：jQuery load eventsjQuery 加载事件
【发布时间】：2013-04-23 00:36:43
【问题描述】：

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

我使用的jQuery函数如下：

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

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

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

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

我正在使用这样的点击和悬停功能：

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

和

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

感谢任何帮助。

【问题讨论】：

不使用一些关于视图的state 信息并在加载完成时更新视图
请解释@ArunPJohny

标签： php jquery ajax

【解决方案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，您需要为每个 div 设置唯一的 id。在使用 .load() 重新加载之前，您循环遍历所有 div 并将它们的当前状态（隐藏或可见）保存在 [{ id : state },..] 格式的对象数组中。 ajax 请求完成后，通过 $.map 循环遍历 Object 数组并为每个 div 设置状态

【讨论】：

【解决方案2】：

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

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

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

【讨论】：