JavaScript：滑塊跳轉到錯誤的ID每2步

我已經構建了一個自定義，污垢和快速，jQuery/JavaScript滑塊......這很好，除了一個問題。JavaScript：滑塊跳轉到錯誤的ID每2步

當使用'上一個'按鈕時，它在第一次單擊時運行完美，但是當再次單擊它時，數組的長度變爲'2'時應爲'1'，因爲只有兩個結果...

代碼：

 jQuery("#sliderNext").click(function(event) { 
    $("#sliderNext").fadeOut(50); 
    $("#sliderPrevious").fadeOut(50); 
    setTimeout(function() { 
       $("#sliderNext").fadeIn(100); 
       $("#sliderPrevious").fadeIn(100); 
      }, 900); 
     slideNumber++; 
     if(slideNumber < image.length && caption.length) { 
     jQuery(".slider-image").css("background-image", "url(" + image[slideNumber] + ")"); 
     jQuery("#caption").text(caption[slideNumber]); 
     console.log("if: " + slideNumber); 
     } 
     else 
     { 
     slideNumber = 0; 
     jQuery(".slider-image").css("background-image", "url(" + image[slideNumber] + ")"); 
     jQuery("#caption").text(caption[slideNumber]); 
     console.log("else: " + slideNumber); 
     } 

    }); 

    jQuery("#sliderPrevious").click(function(event) { 
    $("#sliderNext").fadeOut(50); 
    $("#sliderPrevious").fadeOut(50); 
    setTimeout(function() { 
       $("#sliderNext").fadeIn(100); 
       $("#sliderPrevious").fadeIn(100); 
      }, 900); 
     slideNumber--; 
    console.log(image.length); 
     if(slideNumber >= 0 && slideNumber <= image.length) { 
     jQuery(".slider-image").css("background-image", "url(" + image[slideNumber] + ")"); 
     jQuery("#caption").text(caption[slideNumber]); 
     console.log("if: " + slideNumber); 
     } 
     else 
     { 
     slideNumber = image.length; 
     jQuery(".slider-image").css("background-image", "url(" + image[slideNumber] + ")"); 
     jQuery("#caption").text(caption[slideNumber]); 
     console.log("else: " + slideNumber); 
     console.log(image.length); 
     } 

    });

我使用不同的運營商嘗試過，if/else語句，它總是將它設置爲2在第二次點擊。

有人能指出我爲什麼會這樣做的正確方向嗎？

來源

2016-03-15 JWDev

這可能是因爲您的點擊事件第二次被綁定到按鈕，因此會跳轉兩次。

嘗試在綁定它們之前「解除」您的點擊事件。

$("#sliderPrevious").unbind(); 
// and then 
jQuery("#sliderPrevious").click(function(event) {...});

對初始化頁面時受到約束的每個事件都執行此操作。

編輯

var myArray = [a,b];

注意myArray.length == 2但myArray[2]是不確定的。

數組索引從[0]開始，這就是爲什麼你必須從你的「counter」變量中減去1。

來源

2016-03-15 10:51:18

謝謝，不幸的是，它沒有解決它......它仍然是這樣做的，從'if'語句從0反彈，直到'else'語句中的'2'。 – JWDev

我很遺憾沒有時間深入研究這個問題，但是應該在函數結束時增加一個值。另外，如果slideNumber在其中設置爲0時，slideNumber如何爲2？ –

在sliderPrevious上，它被設置爲等於'image'數組的長度......它有兩個結果，所以它應該是0或1，而不是0,1或2（因爲數組從0開始）。所以我不知道爲什麼image.length投擲2. – JWDev

JavaScript：滑塊跳轉到錯誤的ID每2步

回答

相關問題