javascript - 如何让我的 jQuery 插件尊重 end()？

Question

对于大多数更改选择的 jQuery 函数调用，可以使用 end 返回选择中的一个步骤。 .例如:

$('#myElement').parent().show().end().css('color', '#ff0000');

这显示了父元素，然后使原始选择变为红色。

但是，当我定义自己的过滤选择的 jQuery 插件时，我没有获得此功能。例如:

$.fn.nextBarOne = function(selector) {
    var ret = this.next().next();

    return (typeof selector === 'undefined') ? ret : ret.filter(selector);
}

如果我现在执行 $('#myElement').nextBarOne().show().end() 我不会返回到原始选择。显然，这是因为函数内部调用了两次 next，然后有时调用了 filter。

我如何定义一个 jQuery 插件来允许我像内置函数一样使用 end？

Answer 1

使用.next()遍历后设置prevObject指向原来的jQuery对象。

$.fn.nextBarOne = function(selector) {
    var self = this,
        ret = (typeof selector === 'undefined') ? 
                this.next().next() : this.next().next().filter(selector);
    ret.prevObject = self; 
    return ret;
}

编辑:

pushStack() 可能更干净。我还在 pushStack 调用中包含了选择器。

$.fn.nextBarOne = function(selector) {
    var ret = (typeof selector === 'undefined') ? 
                this.next().next() : this.next().next().filter(selector);
    return this.pushStack(ret, "nextBarOne", selector || "");           
}

An example here