我有一个非常简单的自定义插件。如果在调用后返回this
,.end()
效果很好。但是,如果它返回$(this)
,则.end()
不起作用。为什么会这样?我在这里错过了什么吗?
Code:
$.fn.fnBar = function() {
$(this).html("hello!");
//return $(this); // Doesn't work
return this; // Works!
};
$("div")
.find("span")
.fnBar()
.end()
.css("color", "red");
答案 0 :(得分:5)
来自文档:
结束当前链中的最新过滤操作 将匹配元素集返回到先前的状态。
在
$("div").find("span").fnBar().end()
end
将过滤状态设置为调用find
之前的过滤状态。
只有$(this)
,您正在重建一个新的jQuery对象,没有任何历史记录。你没有过滤操作也没有链,所以没有什么可以取消的。
jQuery end
函数实现如下:
end: function() {
return this.prevObject || this.constructor(null);
},
这意味着您可以通过记录jQuery对象的prevObject
属性来查看差异:
console.log(this.prevObject);
console.log($(this).prevObject); // will give undefined
答案 1 :(得分: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");