連續按下時按鈕不起作用

Question

我有以下幻燈片效果，當您連續按兩次以上相同的按鈕之一時不起作用。意思是，您選擇紅色按鈕來顯示其顏色，再次按紅色隱藏該顏色。當你第三次按下它時，它將不起作用。要讓紅色再次工作，您需要選擇不同的顏色。這發生在所有按鈕上。我該如何阻止？ fiddle demo

// When the DOM is ready, initialize the scripts. 
jQuery(function($){ 

    // Get a reference to the container. 
    var container = $(".container"); 

    // Bind the link to toggle the slide. 
    $("a").click(function(event){ 
     // Prevent the default event. 
     event.preventDefault(); 
     var $this = $(this); 
     var $target = $("#target"); 

     if ($target.attr("class") === $this.attr("data-color")) { 
      container.slideUp(500); 
     } else { 
      // Hide - slide up. 
      container.slideUp(500, function(){ 
       $target.attr("class", $this.attr("data-color")); 
       // Show - slide down. 
       container.slideDown(500); 
      }); 
     } 
    }); 

}); 

Answer 1

您必須刪除類屬性一旦彩色幻燈片背下來，否則它通過你的病情：

container.slideUp(500, function() { 
    $target.removeAttr("class"); 
}); 

演示：http://jsfiddle.net/k5L5N/2/