jquery - 切换表单选项卡由

Question

我使用块显示列表项制作了一些表单选项卡。然后我还有下一个和上一个按钮，$('#wiznext')和$('#wizprev')。每当单击下一个时，就会选择选项卡列表中的下一个列表元素，并完成相应的操作。

HTML 是这样的：

<ul id='tabs'>
<li> Tab 1 </li>
<li> Tab 2 </li>
...

jquery是这样的：

$('#wizprev').click(function(){
   switchTab($current.prev('li').attr('id'));
 }

但是我想提出一个条件，即如果没有上一个列表项，请不要切换选项卡。因此，如果用户已经在 Tab 1 上，那么点击previous不应该做任何事情。

我正在这样做：我尝试了这种情况，但没有任何区别：

if($current.prev('li').length>0)
            switchTab($current.prev('li').attr('id'));

这样做的正确方法是什么？

Answer 1

保留某种计数变量，当用户单击上一个或下一个时，它会增加或减少。像这样的东西：

var tabCounter = 1;
$('#wizprev').click(function(){
    if(tabCounter > 1) {
        tabCounter--;
        switchTab($current.prev('li').attr('id'));
    }
}

$('#wiznext').click(function() {
    if(tabCounter < $('#current li').length) {
        tabCounter++;
        switchTab($current.next('li').attr('id'));
    }
});

像这样，跟踪选项卡编号，如果用户已经在第一个选项卡上，则不要做任何事情。然后检查何时转到下一个选项卡它不是最后一个

Answer 2

如果您检查是否有下一个，请使用

var next = $('#your-selector').next().length;

if(next == 0)
{ 
    return false;
} else {
    // do stuff
}

如果您检查是否有以前的项目，请使用

var prev = $('#your-selector').prev().length;

if(prev == 0)
{ 
    return false;
} else {
    // do stuff
}