为了账号安全,请及时绑定邮箱和手机立即绑定

jQuery中的bind和live方法有什么区别?

jQuery中的bind和live方法有什么区别?

人到中年有点甜 2019-11-27 11:08:47
我很好奇知道bind和live函数之间的区别。在我看来,它们几乎是相同的。我读了live / bind方法的好处,但是并没有告诉我区别。谢谢
查看完整描述

3 回答

?
繁花如伊

TA贡献2012条经验 获得超12个赞

.bind()在调用时将事件附加到存在或匹配选择器的元素。之后创建的任何元素或由于更改了类而继续匹配的任何元素都不会触发绑定事件。

.live()适用于现有和将来的匹配元素。在jQuery 1.4之前,此事件仅限于以下事件:click,dblclick mousedown,mouseup,mousemove,mouseover,mouseout,keydown,keypress,keyup


查看完整回答
反对 回复 2019-11-27
?
慕沐林林

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。


查看完整回答
反对 回复 2019-11-27
?
MMMHUHU

TA贡献1834条经验 获得超8个赞

想象这种情况:

  1. 我有几个<img>要素。

    • $('img').bind('click', function(){...});

    • 添加一些额外的图片(使用get()html(),任何东西)

    • 新图像没有任何约束!

当然,由于$('img')...在执行步骤2 时不存在新图像,因此不会将事件处理程序绑定到它们。

现在,如果您这样做:

  1. 我有几个<img>要素。

    • $('img').live('click', function(){...});

    • 添加一些额外的图片(使用get()html(),任何东西)

    • 新图像确实具有约束力!!

魔法?一点点 实际上,jQuery将通用事件处理程序绑定到DOM树中较高位置的另一个元素(body?document?nocept),并使事件冒泡。当到达通用处理程序时,live()无论元素是在live()调用之前还是之后创建的,它都会检查事件是否与您的事件匹配,如果匹配,则将事件触发。


查看完整回答
反对 回复 2019-11-27
  • 3 回答
  • 0 关注
  • 370 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信