1.事件委托:
实例:
<body>
<ul>
<li>11111</li>
<li>22222</li>
<li>33333</li>
<li>44444</li>
<li>55555</li>
</ul>
<li>66666</li>
<li>77777</li><br>
<button id="btn1">添加新的li</button>
<button id="btn2">解除事件委托</button>
<script>
//事件委派,当新添加的li也会有改变背景颜色的事件
$('ul').delegate('li','click',function(){
$(this).css('background','red')
})
$('#btn1').click(function(){
$('ul').append('<li>新增li。。。。。</li>')
})
$('#btn2').click(function(){
$('ul').undelegate('click')
})
</script>
</body>
delegate:
将点击li标签元素,改变背景颜色的事件委托给ul,事件的委托的好处就是,当后来新添加的li标签元素也具有点击改变背景颜色的事件。
$('ul').delegate('li','click',function(){
ul:为被委托方,li为委托方,click:为事件名,fun为回调函数
undelegate:解除事件委托