我在$document.ready()中绑定了mouseenter和mouseleave事件,如下所示：
$( ".collection_add_to" ).hover(
function() { $(this).find( ".playlists" ).fadeIn("fast"); },function() { $(this).find( ".playlists" ).fadeOut("fast"); }
);
用户可以请求更多具有“.collection_add_to”类的搜索结果.它们会附加到现有的搜索结果中,如下所示：
$.get("context/collection/",$data,function(result) {
$( result ).appendTo( "#collection_song_items" );
// rebind_hover();
});
我加倍检查返回的结果是否为“.collection_add_to”类.我还尝试在额外的例程中重新绑定它：
function rebind_hover() {
$( ".collection_add_to" ).hover(
function() { $(this).find( ".playlists" ).fadeIn("fast"); },function() { $(this).find( ".playlists" ).fadeOut("fast"); }
);
}
没有任何效果,悬停事件不再适用于新添加的项目.使用$load()函数时,它可以正常工作.如何在动态加载的内容上再次使用悬停事件,尤其是在使用append()或appendTo()添加内容时？
编辑
感谢irc和Raminson的sacho：
$(document).on("mouseenter",".collection_add_to",function() {
console.log("MOUSEENTER");
});
$(document).on("mouseleave",function() {
console.log("MOUSELEAVE");
});
我不清楚事件委托应该从一个节点来完成,该节点应该在DOM中比目标元素更高.
