如何知道我是否已達到最後'li'項目

Question

我用'li'標籤和jquery進行了幻燈片放映。

整個'ul'相對於Next/Prev按鈕向左或向右移動，其寬度等於放在一起的所有幻燈片的總寬度，即每個700px。並且只允許在視口中顯示1張幻燈片，寬度等於700px。但是，當我點擊下一個節目時，儘管沒有更多的幻燈片。

解決方法是在最後一張幻燈片顯示在視口中時隱藏「下一步」按鈕。我怎麼做？

或者，也許另一種解決方案是值得歡迎...

這是我的簡化代碼：

var slideList = $('#slideWindow ul') 

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

    slideList.animate({ 'left': '-=700px' }); 

    if($('li:last').next() === 0){ 

     $(this).hide(); 

    } else { 

     $(this).show(); 

    } 

    return false; 

}); 

Answer 1

如果有某一類應用是目前正在觀看liclassBeingViewed，你可以只是這樣做：

if($('li').last() == $('li.classBeingViewed')){ 
    $(this).hide(); 
else { 
    $(this).show(); 
} 

或者你可以跟蹤索引。這是可取的，因爲它允許在兩個方向上進行動畫。

var slideList = $('#slideWindow ul'); 
var listIndex = 0; 
var numLiElements = $('li').length; 

$('#next').click(function(e){ 
    slideList.animate({ 'left': '-=700px' }); 
    if(listIndex == numLiElements){ 
     $(this).hide(); 
    } else { 
     listIndex += 1; 
     $(this).show(); 
    } 
    return false; 
}); 

然後，您可以在點擊處理程序時要反轉動畫遞減listIndex到$('#previous')。