jQuery不执行绑定到动态创建的元素的处理程序

Question

我正在使用Jquery动态加载我的网站页面。基本上隐藏和显示div取决于您点击哪个主菜单选项。

问题出现在每个页面上的子菜单;当页面改变时菜单改变。我清空<ul>并在每次换页时追加新的<li>。

我有jQuery的悬停和点击与子菜单<li>去功能，他们只工作，如果页面刷新。功能似乎停止工作，因为我删除了<li>，然后添加新的。

我不明白为什么这些功能不只是去新的<li>。

这是为什么？

Answer 1

从我的理解你的问题可能不使用.live（）方法..见http://api.jquery.com/live/。当添加新的li时，DOM已经被加载，所以你的新的li标签没有资格附加.hover（）或者你想要的任何事件。这可能不是你正在寻找..但必须足够接近

Answer 2

我有同样的问题。 jQuery只能将事件绑定到jQuery脚本加载（页面加载）时存在的元素。为了让事件影响您新创建的元素，您需要将.live添加到您的代码中。 像这样：

$(".menu").live("hover", function(){ 
    // your action here 
}); 

在此的更多信息，http://api.jquery.com/live/ 找到我相信有像.bind做同样的或类似的事情，一些额外的命令，等等，但我一直使用.live 我希望有所帮助！

Answer 3

从jQuery 1.7开始，新的非弃用方法是使用.on()处理程序。如果您使用的是此版本，而不是.live()，请使用：

$('#menu').on('hover', 'li', function() { ... });