jQuery .prev() 类型，无论其父级等

发布于 2024-12-10 12:42:58 字数 693 浏览 1 评论 0原文

有没有一种简单的方法可以获取 DOM 中元素先前出现的位置？如果我正在查看 #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') 似乎也只搜索父级... Am我在这里缺少一些东西吗？这感觉应该比 $('#text3').parent().prev().find('input') 容易得多：D

原文

is there a simple way to get the previous occurrence of an element in the DOM? If I'm looking at #text3 and I want to get ahold of the previous input #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') doesn't work cause it's within the parent and .prevAll('input') seems to only search the parent as well... Am I missing something here? This feels like it should be much easier than $('#text3').parent().prev().find('input') :D

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

寻找我们的幸福 2024-12-17 12:42:58

您可以使用 $.index() ，像这样：

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

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

You can use $.index(), like so:

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

For example: http://jsfiddle.net/pYaBL/1/

回复收藏 0 原文

囍孤女 2024-12-17 12:42:58

我创建了一个新的 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");

Fiddle：http://jsfiddle.net/QWRWh/

I've created a new jQuery plugin which returns the "real" previous input element. Include this code:

(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);

Usage:

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

Fiddle: http://jsfiddle.net/QWRWh/

回复收藏 0 原文

蓝天白云 2024-12-17 12:42:58

其他两个答案都假设您正在使用的元素与您正在查找的元素属于同一类型。如果它是任意的，这应该可以工作（在较大的文件上性能不是很好）。

结合其他两个答案：

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

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

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

Both other answers assume that the element you are using is of the same type of the element you're looking for. If it's arbitrary, this should work (performance not be great on larger files).

Sort of combining the two other answers:

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

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

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

回复收藏 0 原文

~没有更多了~