單擊和.next（） - 更好的方法？

Question

示例 - jsFiddle

所以我建立使用下面的代碼一個簡單的滑塊：

activeSlide.removeClass("active") 
    .next().addClass("active") 

if (activeSlide.next().length === 0) { 
    firstSlide.addClass("active"); 
} 

它所有的工作可愛。我想我也許可以用類似的東西來創建一個前進和後退按鈕：（？有點慢）

control.on('click', 'a.next', function() { 
    activeSlide = activeSlide 
     .next().removeClass("active") 
     .next().addClass("active"); 
}); 

這工作好了，中間的幻燈片，但似乎並沒有觸發第一個或最後一個。

如果任何人有更好的方法建議，或有一個想法如何調整上述代碼，將不勝感激。

Answer 1

有三個問題與您的代碼：

1. 事件處理（在問題的第二塊）的設置是由定時器（只看到上的jsfiddle）調用的函數內。將它移到外面，或者您將設置多個事件處理程序。
2. 論您呼叫next()第二碼塊中的第四行，這意味着你是從下一個塊，而不是活性一個除去active類。
3. activeSlide變量將被事件處理程序函數的關閉捕獲，並且當按鈕被擊中時可能不會指向當前活動的幻燈片。在事件處理程序中重新初始化activeSlide和$('.slide.active')。

 

control.on('click', 'a.next', function() { 
    $('.slide.active') 
     removeClass("active") 
     .next().addClass("active"); 
});