Question

我正在使用旋转木马，我想让下一个/上一个按钮正常工作。

我尝试添加以下代码，但它没有正确更新索引。任何帮助将不胜感激！

$($btnNext).click(function (event) {
     updateSlides(index + 1);
     event.preventDefault();
 }
 $($btnPrev).click(function (event) {
     updateSlides(index - 1);
     event.preventDefault();
 }

Answer 1

当调用这些按钮上的click事件时，index变量未定义。有几种不同的方法来计算索引，我在小提琴中使用的方法是在attribute上设置slider，然后在click事件上检查它：

 function updateSlides(index, paused) {
     $($slider).attr('data-index', index);
     ...
 }

 $($btnNext).click(function (event) {
     var index = parseInt($('.slider').attr('data-index'));
     if(index > $('.slider .content li').length) {
         index = 0;
     }
     console.log('#next', index);
     updateSlides(index + 1);
     event.preventDefault();
 });

 $($btnPrev).click(function (event) {
     var index = parseInt($('.slider').attr('data-index'));
     if(index < 0) {
         index = 0;
     }
     console.log('#previous', index);
     updateSlides(index - 1);
     event.preventDefault();
 });

请在此处查看更新的小提琴：http://jsfiddle.net/sbp76sLc/14/

jQuery Carousel下一个/上一个按钮

1 个答案: