jquery使用切片來顯示Li的基於點擊

Question

我有3個項目，我想一次顯示。我總共有4個。如果用戶點擊左箭頭，應該從開始和結束減去一個項目，如果他們點擊右箭頭，它應該添加到開始和結束。我的問題是，當我點擊前進時，它不會在倒退時加或減。這可能相當簡單。這是我的代碼。再說一遍，除非我以這種錯誤的方式進行，否則當我單擊右箭頭或左箭頭時，我希望我的起始索引和結束索引發生更改。 jsfiddle

$(function() { 
    var backLi = 0; 
    var forwardLi = 3; 
     var end = forwardLi + 1;   

if (end == $(".divsize ul li").length) end = undefined; 
    $(".divsize ul li").css({"display" : "none"}); 
if (end) 
    $(".divsize ul li").slice(backLi , forwardLi).addClass("showItem"); 


    $(".rightArr").click(function() { 
     backLi = backLi + 1; 
     forwardLi = forwardLi + 1; 
     $('input.forward').val(backLi); 
     $('input.backLi').val(forwardLi);  
    });  

    $(".leftArr").click(function(){ 
     backLi = backLi - 1; 
     forwardLi = forwardLi - 1; 
     $('input.forward').val(backLi); 
     $('input.backLi').val(forwardLi); 
    }); 
}); 

謝謝你的幫忙。

Answer 1

閱讀文檔後，我不喜歡你的語法。看看這個jQuery代碼解決您的問題：

var backLi = 0; 
    var forwardLi = 2; 
    $(".divsize ul li").slice(backLi , forwardLi); 
    $(".rightArr").click(function() { 
     console.log(backLi, forwardLi); 
     backLi = backLi + 1; 
     forwardLi = forwardLi + 1; 
     $('input.forward').val(backLi); 
     return false; 
    })  
    $(".leftArr").click(function() { 
     console.log(backLi, forwardLi); 
     backLi = backLi - 1; 
     forwardLi = forwardLi - 1; 
     $('input.forward').val(backLi); 
     return false; 
    }) 

順便說一句 - 你有lefttArr（額外的「T」），而不是leftArr在你的代碼。