Javascript 为什么jQuery add（）方法似乎不返回jQuery对象？_Javascript_Jquery

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

javascript jquery

Javascript 为什么jQuery add（）方法似乎不返回jQuery对象？,javascript,jquery,Javascript,Jquery,考虑一下，您希望向页面上的许多链接添加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&

考虑一下，您希望向页面上的许多链接添加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>

好了，够了

你可以一把一把地看这个问题

根据，返回值是一个新的jQuery对象。同样，函数处理程序中的AMAIK附加到jQuery对象的事件，

此

引用DOM元素

为什么通过使用

add（）

方法，

这个处理函数的引用了文档
？我不明白。我无法用我的知识做出合乎逻辑的判断。换言之：
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
});

更新：
谢谢你的回答。我再次向读者推荐这个页面，这样每个人都可以改进
var purchaseLinks = $('.purchase'),
    sellLinks= $('.sell');
purchaseLinks.add(sellLinks).on('click', function(e) {
    e.preventDefault();
    alert(this.href);
});

.add（）
将.live（）
更改为.on（）
，没有问题

.add（）
将.live（）
更改为.on（）
，没有问题
小提琴的问题在于使用.live（）
。jQuery文档声明：
不支持链接方法。例如，$（“a”）.find（“.offsite，
.external“）.live（…）无效，无法按预期工作
幸运的是，对每个人来说，都是这样，所以你不必再担心这样的事情了。您可以改为在
上使用，并利用事件委派

更新（在@Esailija的评论之后）
这就是实际发生的情况。您可以在此处调用jQuery：
var purchaseLinks = $('.purchase');

这将生成一个jQuery对象，该对象具有一个选择器
属性。然后调用.add（）
，这反过来调用内部推堆栈方法：
return this.pushStack(isDisconnected(set[0]) || isDisconnected(all[0]) ? all : jQuery.unique(all));

创建新的jQuery对象。它只被一个参数调用。以下是该方法的相关部分（请注意，名称
和选择器
在本例中都是未定义的
）：
还要注意，this.context
现在是文档（因为原始jQuery对象没有指定上下文，所以假定了可能的最高上下文）
因此，新形成的元素集没有selector
属性，并且将文档作为上下文。然后当我们调用.live（）
时，jQuery只调用.on（）
如下：
jQuery( this.context ).on( types, this.selector, data, fn );

在那里我们可以看到问题所在。上下文是文档，没有选择器，因此事件处理程序绑定到文档。在我们的案例中，上述行实际上是这样的：
jQuery( document ).on( "click", function() {
    //Your event handler
});

您可以通过点击文档中的任意位置而不仅仅是链接来触发您的警报
来看到这一点
这个故事的寓意是什么？停止使用.live（）
 小提琴的问题在于使用.live（）
。jQuery文档声明：
不支持链接方法。例如，$（“a”）.find（“.offsite，
.external“）.live（…）无效，无法按预期工作
幸运的是，对每个人来说，都是这样，所以你不必再担心这样的事情了。您可以改为在
上使用，并利用事件委派

更新（在@Esailija的评论之后）
这就是实际发生的情况。您可以在此处调用jQuery：
var purchaseLinks = $('.purchase');

这将生成一个jQuery对象，该对象具有一个选择器
属性。然后调用.add（）
，这反过来调用内部推堆栈方法：
return this.pushStack(isDisconnected(set[0]) || isDisconnected(all[0]) ? all : jQuery.unique(all));

创建新的jQuery对象。它只被一个参数调用。以下是该方法的相关部分（请注意，名称
和选择器
在本例中都是未定义的
）：
还要注意，this.context
现在是文档（因为原始jQuery对象没有指定上下文，所以假定了可能的最高上下文）
因此，新形成的元素集没有选择器
属性，而是将文档作为其上下文。然后当我们调用.live（）
时，jQuery只调用.on（）
如下：
jQuery( this.context ).on( types, this.selector, data, fn );

在那里我们可以看到问题所在。上下文是文档，没有选择器，因此事件处理程序绑定到文档。在我们的案例中，上述行实际上是这样的：
jQuery( document ).on( "click", function() {
    //Your event handler
});

您可以通过点击文档中的任意位置而不仅仅是链接来触发您的警报
来看到这一点
这个故事的寓意是什么？停止使用.live（）
 这是live
方法的问题吗？请看我的小提琴并点击链接。可能是因为你的名字。但不是我；）。这是live
方法的问题吗？请看我的小提琴并点击链接。可能是因为你的名字。但不是我；）.live
支持jQuery版本中的链接，其中.on
受支持。虽然有些方法可以更改.selector
属性，但在使用.live
之后，会产生意外的结果。但一般来说，锁链不是问题。@Esailija-谢谢，我不知道。我已经用发生的事情的全部细节更新了我的答案。.live
支持jQuery版本中的链接，在jQuery版本中支持.on
。虽然有些方法可以更改.selector
属性，但在使用.live
之后，会产生意外的结果。但一般来说，锁链不是问题。@Esailija-谢谢，我不知道。我已经用发生的事情的全部细节更新了我的答案。如果您对jQuery内部实际发生的事情的全部细节感兴趣，我已经更新了我的答案。如果您对jQuery内部实际发生的事情的全部细节感兴趣，我已经更新了我的答案。