jQuery事件委托
2020-02-01 本文已影响0人
David_Rao
什么是事件委托?
请别人帮忙做事情,然后将做完的结果反馈给我们
为什么使用事件委托
- 使用场景:
即使一开始对所有li添加click事件,因为入口函数在所有dom元素都加载完毕才执行,新增的li不会执行click添加的事件。 - 解决方案:
将li的click事件委托给ul来监听 - 实现原理:
点击的是li,但li没有绑定click事件,根据事件冒泡,传递到ul,ul有click事件,所以click得到响应。
但是触发的对象仍然是li,所以this指向的是li,而不是ul。
怎么是用事件委托
"委托给的元素".delegate("有需要委托的元素", "委托事件", 委托方法)
jQuery3.0以上版本弃用了该方法,可用on()代替
$(function () {
$("button").click(function () {
$("ul").append("<li>我是新增的li</li>")
});
$("ul").delegate("li", "click", function () {
console.log($(this).html)());
});
});