JQ高级事件之事件委托

来源:互联网 发布:nba百视通网络电视 编辑:程序博客网 时间:2024/05/29 15:55

事件委托
跟字面意思一样,需要找一个东西来帮助一起完成某个东西。用我们JQ的语言来说就是,我有2000个按钮,但我们不能一个一个绑定,这样太过于浪费操作,那我们怎么做呢,事件默认情况下是冒泡的,我们可以把事件直接绑定他们的父元素,也就是说通过指定一个事件处理程序,就可以管理某一类的所有事件,这样我们可以通过event.target属性找到它实际点的是那个元素(这里说的是JS原生方法的实现),当然还可以实现动态绑定

<div id="btn">    <input type="button" value="button1" class="button">    <input type="button" value="button12" class="button">    <input type="button" value="button123" class="button"></div><script>    $('.button').bind('click',function(){        alert('1')//这就是事件不委托,每个按钮有自己的事件    })    $('#btn').delegate('.button','click',function(){        alert('1')//这就是事件委托,    })    //动态绑定    $('#btn').delegate('.button','click',function(){        $(this).clone().appendTo('#btn');    });    //取消绑定    $('#btn').undelegate('.button','click')//当然还可以使用命名空间的方法</script>

那我们什么时候使用事件委托呢,又什么时候使用事件绑定呢
当我们DOM中有很多元素绑定相同事件时,或者动态绑定时,首选事件委托

0 0
原创粉丝点击