jquery:使用ajax加载的内容绑定悬停事件

9 jquery hover

我正在使用jQuery尝试绑定一些新加载的<li>元素,.hover()我有点卡住了.目前我正在重装的内容<ul>与阿贾克斯,并有一个与悬停事件.hover();<li>.悬停事件当然适用于非ajax加载的内容.

我知道我可以使用mouseover/ mouseout绑定事件,.live();这是一个很好的解决方案,如果你将鼠标悬停绑定的当前元素的子元素悬停在那里,那么它不是mouseover/ mouseout坏习惯来破坏事件.所以我使用的原因.hover();是因为我可以自由地悬停我的悬停绑定元素的子节点,而不会取消事件.

bind();似乎根本不起作用,所以我的问题是..是否有任何用途试图将ajax加载<li>事件绑定并保持悬停效果为hover();,或者我应该翻转并使用mouseover/ mouseoutwith live();并尝试解决其他一些人如何悬停儿童问题?

成功消息:

success: function(data){ 
           $('ul#list').bind().append("<li>test test</li>");
         }
Run Code Online (Sandbox Code Playgroud)

red*_*are 8

bind就是这样的.例如

$('#list').bind('mouseover', function(){})
Run Code Online (Sandbox Code Playgroud)

但是我认为你需要做的就是在文档首次加载时调用用于绑定事件的相同函数.如果这是在文档就绪块内,则将其解压缩到一个函数中,并在doc ready和ajax success事件中调用相同的函数.

例如

$(document).ready( function(){

   bindHover( $('#list>li') )

   $.ajax({ success: function(data){
                         bindHover( data.find('li') );
                     },
            url: bla
   });

})

function bindHover($liList){
  $liList.hover( fn, fn )
}
Run Code Online (Sandbox Code Playgroud)