2

我有一个非常简单的自定义插件。如果它this在调用它后返回，.end()效果很好。但是，如果它返回$(this)，.end()则不起作用。为什么会这样？我在这里错过了什么吗？

代码：

$.fn.fnBar = function() {
    $(this).html("hello!");
    //return $(this); // Doesn't work
    return this; // Works!
};


$("div")
    .find("span")
        .fnBar()
    .end()
    .css("color", "red");
4

2 回答 2

5

从文档中：

结束当前链中最近的过滤操作，并将匹配的元素集返回到其先前的状态。

在

$("div").find("span").fnBar().end()

end将过滤的状态设置为调用之前的状态find。

使用 just $(this)，您正在重建一个新的 jQuery 对象，没有任何历史记录。你没有过滤操作，也没有链，所以它没有什么可取消的。

jQueryend函数是这样实现的：

end: function() {
    return this.prevObject || this.constructor(null);
},

这意味着您可以通过记录prevObjectjQuery 对象的属性来查看差异：

console.log(this.prevObject);
console.log($(this).prevObject); // will give undefined
于 2013-01-03T14:31:16.637 回答
4

在 jQuery 方法内部，this已经是 jQuery 对象。$(this)创建一个全新的jQuery 对象，没有过滤历史。

同样的问题，但可能更容易理解：

var bar = $("div").find("span");
// This doesn't work
$(bar).end().css("color", "red");
// This does
bar.end().css("color", "red");
于 2013-01-03T14:33:34.570 回答