我在我的 Web 应用程序中使用 jQuery。在阅读其文档时,我阅读了live()
和delegate()
。虽然他们解释了这两种方法,但我不明白它们之间的确切区别。也不确定哪种方法在哪种情况下是理想的。
请帮助我清楚地了解这些方法。
谢谢
我在我的 Web 应用程序中使用 jQuery。在阅读其文档时,我阅读了live()
和delegate()
。虽然他们解释了这两种方法,但我不明白它们之间的确切区别。也不确定哪种方法在哪种情况下是理想的。
请帮助我清楚地了解这些方法。
谢谢
.live()
要求您立即运行选择器,除非您使用结果,否则非常浪费。此处的事件处理程序附加到document
,因此必须检查来自任何冒泡元素的该类型的所有事件。这是一个使用示例:
$(".myClass").live("click", function() { alert("Hi"); });
请注意,该语句$(".myClass")
运行该选择器以查找具有该类的所有元素,即使我们不关心它们,我们想要的只是稍后当事件冒泡到时".myClass"
匹配的字符串。click
document
.delegate()
实际上在.live()
内部使用,但有上下文。选择器不会立即运行,因此它已经更有效了,并且它不会附加到document
(尽管它可以)它更加本地化......并且来自您不关心的其他元素树的所有其他事件永远不会甚至检查冒泡时...再次更有效。这是一个使用示例:
$("#myTable").delegate("td", "click", function() { alert("Hi"); });
现在这里发生了什么?我们跑了$("#myTable")
去重视(当然不是越贵的元素document
,但我们使用的结果。然后,我们重视的事件处理程序到(或那些在其他情况下)的元素,只有clicks
从内该元素是对检查"td"
选择在发生的时候,没有从任何地方像.live()
做(因为一切都在里面document
)。
delegate()映射到jQuery 代码中的live()。主要区别在于,在您希望将事件委托给不同元素的元素上调用live()。 live()将这些事件委托给文档对象。
delegate(),另一方面,允许您通过传递选择器来设置委托给哪些元素事件。如果原始元素与选择器匹配,则处理冒泡到该元素的事件。
正如@NickCraver提到的,delegate() 的性能比 live 更好,因为它不一定从页面上的每个元素捕获事件,并且它不会立即查询选择器。
来自 jQuery 文档:
从 jQuery 1.7 开始,不推荐使用 .live() 方法。使用 .on() 附加事件处理程序。旧版本 jQuery 的用户应该优先使用 .delegate() 而不是 .live()。
直播方式:
$("#mymethod").live("click", function() { alert("It checks the entire DOM"); });
实时方法检查整个 DOM 中的 #mymethod(有时根据您的 DOM 内容需要时间)
委托方式:
$('.mycontainer').delegate('#mymethod','click',function() { alert('Checks only in mycontainer portion') });
Delagate 不会搜索您的整个 DOM,它只搜索您的 mycontainer 部分。(提高性能)