当网页中需要触发的事件比较多的时候,为了避免内存泄露,我们可以把事件注册到其父元素上,这样整个父元素就只有一个事件,避免直接吧事件注册到多个对象中。
<div>
<p> 这是第一个 p</p>
<p> 这是第二个 p</p>
<p> 这是第三个 p</p>
<span> 这是 span</span>
...
<p> 这是第一百个 p</p>
</div>
假如我有一个DIV div里面有100个p标签,如果我想要给p加事件,直接给p添加的话会非常多。那么我们就可是使用事件委托
使用JQuery 中的 delegate注册委托事件,undelegate移除事件 (在jquery3.0中 delegate已被弃用,使用 on 替代)
// 被委托的标签.delegate("由谁触发","事件名",function(){})
//$("div").delegate("p","click",function(){
$("div").on("p","click",function(){
console.log('哈哈');
})
这样我们点击p的时候就会触发事件,点击span的时候就不会触发,以为我们在委托事件中指定了由p触发,所以span 不会触发该函数。通俗的理解就是div有100万,div说了我这100万只能让p花,其他的不能花。
这样就实现了只注册一个事件,所有的p都能够触发这个事件了