问题:
<ul>
<li></li>
<li></li>
</ul>
当li是通过jquery动态添加时,通过$(“ul li”)是无法对li进行操作的。原因是因为页面已经将JS加载完毕,此时新增请求动态添加节点,自然获取不到。
解决办法:
动态添加的标签要事件委托才能获取到节点
1.通过on绑定事件(注意使用on绑定事件时,hover无效,因为on的参数只能传一个函数)
语法:
$(selector).on( types, data, fn)
例子:
$("ul").on("mouseenter","p",function(){
$("ul li").click(function(){
alert("1")
})
})
注意:这里ul为非动态添加的节点,不然也获取不到。
除此之外还有其他的绑定方法:
live绑定:
$("ul").live("click",function(){
alert("ok");
});
delegate绑定:
$("ul").delegate("a","click",function(){
alert("ok");
})
bind绑定:
$("ul").bind("click",function(){
alert("ok");
});
区别:
bind()的事件函数只能针对已经存在的元素进行事件的设置,是绑定在元素上的。live(),on(),delegate()均支持未来新添加元素的事件设置。
如果你开发使用的是最新版本的jQuery,完全可以使用on()方法来处理所有的事件绑定。