首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >jQuery.bind()和jQuery.on()有什么区别?

jQuery.bind()和jQuery.on()有什么区别?
EN

Stack Overflow用户
提问于 2012-02-02 22:12:04
回答 3查看 5.5K关注 0票数 17

为什么在jQuery 1.7中.on()现在是首选的?

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2012-02-02 22:16:07

.on()现在在一个统一的方法中提供了.live().delegate().bind()的组合。您可以通过如何使用.on()的参数来获得这三种方法中的任何一种的行为。

这些对在功能上是相同的:

代码语言:javascript
复制
// events bound directly to the object they occur on
$('.button').on('click', fn);
$('.button').bind('click', fn);

// events intercepted after bubbling up to a common parent object
$('.container').on("click", '.button', fn);
$('.container').delegate('.button', "click", fn);

更多信息在jQuery blog entry中描述。

在统一这些独立的函数之前,jQuery有多个不同的实现。现在,.on()是超集函数,而.bind().live().delegate()在它们的实现中都只是调用.on(),所以现在只有一个实际事件处理的实现。因此,从这个角度来看,这也是一个代码清理和流线化问题。类似地,.die().undelegate().unbind()现在只是调用.off(),而不是有单独的实现。

注意:所有版本的jQuery都不推荐使用.live(),因为它只是拦截document对象上的所有冒泡事件的特例,因此可以很容易地用.delegate().on()替换它,并且当大量事件都在document对象上处理时,在每个事件上检查大量选择器可能会成为性能问题。将这样的委托事件挂接到离事件发生地点更近的公共父对象上要比将它们都放在document对象上更有效(因此.live()不适合使用)。

从jQuery 1.7源代码中,您可以看到所有这些函数是如何调用.on().off()

代码语言:javascript
复制
bind: function( types, data, fn ) {
    return this.on( types, null, data, fn );
},
unbind: function( types, fn ) {
    return this.off( types, null, fn );
},

live: function( types, data, fn ) {
    jQuery( this.context ).on( types, this.selector, data, fn );
    return this;
},
die: function( types, fn ) {
    jQuery( this.context ).off( types, this.selector || "**", fn );
    return this;
},

delegate: function( selector, types, data, fn ) {
    return this.on( types, selector, data, fn );
},
undelegate: function( selector, types, fn ) {
    // ( namespace ) or ( selector, types [, fn] )
    return arguments.length == 1? this.off( selector, "**" ) : this.off( types, selector, fn );
},
票数 28
EN

Stack Overflow用户

发布于 2012-02-02 22:22:31

主要的区别是,.bind要求元素(选择器)在附加时存在,而.on没有这个要求,坦率地说,在我看来,.on有更好/更优雅的语法。请参阅文档第一段http://api.jquery.com/bind/

票数 3
EN

Stack Overflow用户

发布于 2012-02-02 22:16:39

旧的方法有点混乱-- live()delegate()bind()之间的区别并不清楚。通过使on()成为处理附加任何事件的函数,而不管它是否存在,它只是更容易使用。

在此之前,live()比新的on()函数慢得多,因此您必须在bind()live()之间做出选择。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9113783

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档