jQuery,接下来,上一个,骑自行车到第一个和最后一个

时间:2013-04-04 15:11:04

标签: javascript jquery

抱歉这个令人困惑的标题。 我想要做的是一个函数(或者只是一个简单的方法),它将执行简单的 .next(),但如果没有下一个元素,则先匹配。对于 .prev()也是如此 - 如果没有前一个元素,则匹配最后一个。 所以我这样做了:

var current_selected = getSelected();
if(current_selected.length) {
    var prev = current_selected.prev();
    if(prev.length) {
        setSelected(prev);
        return;
    }
}
setSelected(getLast());

但我真的不喜欢它,我认为有一些很好的方式。有什么想法吗? ( getSelected getLast 会返回jQuery对象。

4 个答案:

答案 0 :(得分:5)

你可以创建一些小便利插件:

$.fn.nextWrap = function() {
    var $next = this.next();
    if ($next.length) return $next;
    return this.siblings().first();
};

$.fn.prevWrap = function() {
    var $prev = this.prev();
    if ($prev.length) return $prev;
    return this.siblings().last();
};

然后,您只需执行$('#something').nextWrap()$('#something').prevWrap()

这是一个快速演示:http://jsfiddle.net/qpDKL/

注意:这的行为大多类似于prev()next()(当然还有包裹行为),但它不支持prev|next(selector)语法。


编辑:这是一个稍微简洁的插件语法,因为它们几乎完全相同:

$.each(['next', 'prev'], function(i, nextOrPrev) {
    $.fn[nextOrPrev + 'Wrap'] = function() {
        var $item = this[nextOrPrev]();
        if ($item.length) return $item;
        return this.siblings()[nextOrPrev === 'next' ? 'first' : 'last']();
    };
});

答案 1 :(得分:1)

这适用于prev案例

var current_selected = getSelected();

var prev = current_selected.prev();
if(prev.length) {
    setSelected(prev);
} else {
    setSelected(getLast());
}

答案 2 :(得分:0)

我能想到的最好的方法是拥有一个你要循环的元素数组。您可以通过两种方式遍历数组:

array.push(array.shift());

var count = 0;
function cycle() {
    return array[count++ % array.length];
}

我认为前者看起来更清洁。

http://jsfiddle.net/ExplosionPIlls/feeF5/

答案 3 :(得分:0)

围绕这些方面的事情:

if (!$('selected').next().length)
    return $('selected').parent().children().first();
else
    return $('selected').next();

if (!$('selected').prev().length)
    return $('selected').parent().children().last();
else
    return $('selected').prev();