jQuery .prev（）类型，无论其父级如何

Question

有没有一种简单的方法来获取DOM中某个元素的先前出现？ 如果我正在查看#text3并且想要#text3先前的输入#text2 。

<div>
    <input id="text1" type="text" value="text1" />
</div>

<div>
    <p>Choose your race!</p>
    <input id="text2" type="text" value="text2" />
</div>

<div>
    <div class="labeledField">
        <label>Text 3:</label>
        <input id="text3" type="text" value="text3" />
    </div>
</div>

.prev('input')不起作用，因为它在父级中，而.prevAll('input')似乎也只搜索父级...我在这里遗漏了什么吗？ 感觉应该比$('#text3').parent().prev().find('input') ：D容易得多

Answer 1

您可以使用$.index() ，如下所示：

var previous = null;
var inputs = $('input');
var index = inputs.index(this);
if (index > 0) {
    previous = $(inputs[index-1])
}

例如： http : //jsfiddle.net/pYaBL/1/

Answer 2

我创建了一个新的jQuery插件，该插件返回“真实”的先前输入元素。 包含以下代码：

(function($){
    $.fn.realPrev = function(selector){
        var thisElem = this.get(0); //Get DOM element for comparison
        var lastElement, foundElement = null;
        $(selector).each(function(){
            if(this == thisElem){
                foundElement = lastElement;
                return false;
            }
            lastElement = this;
        });
        return $(foundElement);
    }
})(jQuery);

用法：

$("#input3").realPrev("input");

小提琴： http ： //jsfiddle.net/QWRWh/

Answer 3

其他两个答案都假定您正在使用的元素与您要查找的元素具有相同的类型。 如果它是任意的，这应该可以工作（在较大的文件上性能不佳）。

结合其他两个答案：

(function($){
    $.fn.realPrev = function(selector){
        var all = $("*");

        return all.slice(0,all.index(this)).filter(selector).last();
    }
})(jQuery);

http://jsfiddle.net/QWRWh/1/