.bind() .live() .delegate()三个方法都是jQuery中用来为被选元素绑定一个或者多个事件的,但是却也有一定的区别。
.bind()
$('a').bind('click',function(){alert("This is bind().");});
很容易理解,当点击a链接时,触发一个alert,这也是最直接的绑定方法,jQuery扫描DOM所有元素,找到每一个'a'并为其click事件绑定一个处理函数。
.live()
$('a').live('click',function(){alert("This is live().");});
live()将处理函数绑定到$(document),当有事件发生,冒泡(即传递)到$(document)节点时,先检查这个事件是不是click,然后再检查选择元素是否匹配'a',两个条件都为true,则触发alert。
.delegate()
$('div').delegate('a','click',function(){alert("This is delegate().");});
jQuery扫描文档,找到'div'为其click事件绑定一个处理函数,'a'选择元素作为参数,当有事件冒泡到‘div’,然后再检查选择元素是否匹配'a',两个条件都true,则处理alert。
区别
- bind()只能绑定事件到当前已有的元素,而不能绑定到未来出现的元素中,.live()和.delegate()则可以适用于当前或未来出现的元素;
- .bind()是绑定到指定元素上,而.live()绑定到$(document)上,当有事件发生,遍历并选择匹配元素,.delegate()绑定事件到指定选择器中,时间冒泡到选择器,则遍历当前选择器,选择匹配元素
速度
根据其绑定方式的不同,可知.bind()速度最快,.delegate()次之,.live()最慢。
.live()也可以绑定到指定元素,而不用绑定到$(document)中,即
$('a',$('div')).live('click',function(){alert("This is live(),too.")};);