3 回答
TA贡献2012条经验 获得超12个赞
.bind()在调用时将事件附加到存在或匹配选择器的元素。之后创建的任何元素或由于更改了类而继续匹配的任何元素都不会触发绑定事件。
.live()适用于现有和将来的匹配元素。在jQuery 1.4之前,此事件仅限于以下事件:click,dblclick mousedown,mouseup,mousemove,mouseover,mouseout,keydown,keypress,keyup
TA贡献2016条经验 获得超9个赞
简而言之:.bind()仅适用于您当前在jQuery对象中选择的项目。.live()将适用于所有当前匹配的元素,以及将来可能添加的任何元素。
它们之间的根本区别是live()利用事件冒泡。也就是说,当您单击一个按钮时,该按钮可能存在于元素<p>中的<div>,,中<body>。因此实际上,您实际上是同时单击所有这些元素。
live()通过将事件处理程序附加到文档而不是元素上,可以工作。当您单击该按钮时,如前所示,文档将收到相同的单击事件。然后,它会备份事件所针对的元素行,并检查是否有任何元素与您的查询匹配。
结果是双重的:首先,这意味着您不必继续将事件重新应用于新元素,因为事件发生时会隐式添加事件。但是,更重要的是(取决于您的情况),这意味着您的代码要轻得多!如果<img>页面上有50个标签,并且您运行以下代码:
$('img').click(function() { /* doSomething */ });
...然后将该函数复制到每个元素中。但是,如果您有以下代码:
$('img').live('click', function() { /* doSomething */ });
...然后该函数仅存储在一个位置(在文档中),并在事件发生时应用于与您的查询匹配的任何内容。
由于这种冒泡行为,因此并非所有事件都可以用这种方式处理。如Ichiban所述,这些受支持的事件包括click,dblclick mousedown,mouseup,mousemove,mouseover,mouseout,keydown,keypress,keyup。
TA贡献1834条经验 获得超8个赞
想象这种情况:
我有几个
<img>
要素。$('img').bind('click', function(){...});
添加一些额外的图片(使用
get()
或html()
,任何东西)新图像没有任何约束!
当然,由于$('img')...
在执行步骤2 时不存在新图像,因此不会将事件处理程序绑定到它们。
现在,如果您这样做:
我有几个
<img>
要素。$('img').live('click', function(){...});
添加一些额外的图片(使用
get()
或html()
,任何东西)新图像确实具有约束力!!
魔法?一点点 实际上,jQuery将通用事件处理程序绑定到DOM树中较高位置的另一个元素(body?document?nocept),并使事件冒泡。当到达通用处理程序时,live()
无论元素是在live()
调用之前还是之后创建的,它都会检查事件是否与您的事件匹配,如果匹配,则将事件触发。
- 3 回答
- 0 关注
- 389 浏览
添加回答
举报