为什么jQuery的add（）方法似乎不返回一个jQuery对象？

Question

考虑要一个Ajax功能添加到您的网页上诸多环节。

<a href='http://domain/purchase/car' class='purchase'>Car</a> 
<a href='http://domain/purchase/bag' class='purchase'>Bag</a> 
<a href='http://domain/purchase/laptop' class='purchase'>Laptop</a> 

和

<a href='http://domain/sell/car' class='sell'>Car</a> 
<a href='http://domain/sell/bag' class='sell'>Bag</a> 
<a href='http://domain/sell/laptop' class='sell'>Laptop</a> 

现在可以定义一些变量来对这些团体的链接在你的JavaScript代码：

var purchaseLinks = $('.purchase'), 
    sellLinks= $('.sell'); 

嗯，够故事）。

你可以看一下这个问题在this小提琴和this之一。

根据jQuery's add() documentation，返回值为新的jQuery对象。再次，AMAIK内被附接到一个jQuery对象，this referes为DOM元素的事件的功能的处理程序。

为什么通过使用add()方法，this的处理函数是指document？我不明白。我无法配合我的知识来形成合乎逻辑的看法。换句话说：

jQueryObject1.click(function(){ 
    // Here, $(this) is the jQuery object 
}); 

jQueryObject2.click(function(){ 
    // Here again, $(this) is the jQuery object 
}); 

jQueryObject1.add(jQueryObject2).click(function(){ 
    // Here $(this) refers to the Document, why? 
    // I think jQueryObject1.add(jQueryObject2) should equal jQueryObject3 
}); 

UPDATE：

谢谢您的回答。我再次提及读者Live is Deprecated页面，让每个人都可以得到改善。

Answer 1

在骗取钱财的问题是使用的.live()。 jQuery文档状态：

链接方法不受支持。例如，$("a").find(".offsite, .external").live(...);是无效的，并没有按预期工作。

幸运的是，对于每个人，.live() method is deprecated，所以你不必担心这样的东西了。您可以改用on并利用活动委派。

---

更新（由@Esailija注释以下）

这是实际情况。你在这里调用jQuery：

var purchaseLinks = $('.purchase'); 

这导致了一个jQuery对象，它具有selector属性。然后调用.add()，这反过来又调用内部pushStack方法：

return this.pushStack(isDisconnected(set[0]) || isDisconnected(all[0]) ? all : jQuery.unique(all)); 

的pushStack method创建新的jQuery对象。它只有一个参数被调用。下面是该方法的相关部分（注意name和selector在我们的例子都是undefined）：

function (elems, name, selector) { 
    // ... 

    ret.context = this.context; 

    if (name === "find") { 
     ret.selector = this.selector + (this.selector ? " " : "") + selector; 
    } else if (name) { 
     ret.selector = this.selector + "." + name + "(" + selector + ")"; 
    } 

    // Return the newly-formed element set 
    return ret; 
} 

还要注意的是this.context现在的文件（因为你原来的jQuery对象没有指定一个背景下，尽可能高的背景）。

因此，新成立的元素集不具有selector财产，并有文件，作为背景。当我们再调用.live()，jQuery的简单调用.on()这样的：

jQuery(this.context).on(types, this.selector, data, fn); 

还有，我们可以看到这个问题。上下文是文档，并且没有选择器，所以事件处理程序被绑定到文档。在我们的例子上面一行有效的是这样的：

jQuery(document).on("click", function() { 
    //Your event handler 
}); 

，您可以通过一个事实，即你的alert通过点击任何地方的文件中，不只是在链接触发的看到这一点。

这个故事的寓意是什么？停止使用.live()！

Answer 2

var purchaseLinks = $('.purchase'), 
    sellLinks= $('.sell'); 
purchaseLinks.add(sellLinks).on('click', function(e) { 
    e.preventDefault(); 
    alert(this.href); 
}); 

没有错.add()变化.live()到.on()。

http://jsfiddle.net/iambriansreed/q573N/5/