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步

回答

相关问题