如何隱藏jquery中的前一個li標籤

我正在開發一個項目，其中有一個5 li的ul標籤。如何隱藏jquery中的前一個li標籤

我想要做的是，我想顯示每個項目一個接一個點擊一個按鈕。意思是當我點擊按鈕時，下一個項目應該是displayd，而前一個應該隱藏。正如一般情況下發生的那樣。

當我們點擊下一個按鈕時，會出現下一個問題，並隱藏前一個問題。

我用下面的HTML代碼：

<div class="span12" style="margin-top:140px;"> 
<ul id="part"> 
<li id="div0" style="display:none;">Question id</li> 
<li id="div1" style="display:none;">Question 2</li> 
<li id="div3" style="display:none;">Question 3</li> 
<li id="div4" style="display:none;">Question 4</li> 
<li id="div5" style="display:none;">Question 5</li> 
</ul> 
<button id="next">Next</button> 
</div>

和jQuery代碼是：

<script> 
$(function(){ 
    var items = $('ul#part li'); 
    if(items.filter(':visible').length == 0) 
    { 
     items.first().show(); 
    } 
    $('#next').click(function(e){ 
     e.preventDefault(); 
    items.filter(':visible:last').next().show(); 
    }); 
}); 
</script>

它顯示下一個項目從UL上按一下按鈕，但我無法隱藏上一個按鈕。

如何隱藏以前的li按鈕，因爲我點擊下一步。

請幫我

來源

2014-01-05 Rohitashv Singhal

這應該工作

<script> 
$(function(){ 
    var items = $('ul#part li'); 
    if(items.filter(':visible').length == 0){ 
     items.first().show(); 
    } 

    $('#next').click(function(e){ 
     e.preventDefault(); 

     var active = items.filter(':visible:last'); 
     active.hide(); 

     var next = active.next(); 
     if (next.length) 
      next.show(); 
    }); 
}); 
</script>

要檢查是否存在接下來，你應該檢查長度。

來源

2014-01-05 05:18:29

還有一件事我要問，我怎麼可以檢查，這是最後一個元素，意味着我要改變這下按鈕提交的最後一個li元素按鈕 –

香港專業教育學院編輯我的回答添加最後一個元素的檢查。 –

Var index=0;/*this should be global variable*/ 

('#next').click(function(e){ 
     e.preventDefault(); 
     items.hide(); 
     items[index].show(); 
     index==items.length-1?index=0:index++; 
});

來源

2014-01-05 05:30:17 user3161877

上Arek的回答工作，使按鈕改爲提交如果條件改變

if (next.length) { 
    next.show(); 
} else { 
    $('#next').html("Submit"); 
}

。

演示Fiddle

來源

2014-01-05 05:33:16 Ajey

如何隱藏jquery中的前一個li標籤

回答

相關問題