jquery - 是否可以仅向toggleClass的remove class部分添加延迟？

是否可以仅向toggleClass的remove class部分添加延迟？

在小提琴中，我希望红色div在单击时立即变为绿色。
但是，当再次单击时，它应该延迟重新变回红色。

http://jsfiddle.net/simbasounds/ggk8xxya/1/

的HTML

<div class="container">
   I am a div
</div>

的CSS

.container {
    padding: 10px;
    background: red;
}

.container.green {
    background: green;
}

jQuery的

$(".container").click(function(){
   $(this).toggleClass('green');
});

最佳答案

从绿色转换为红色时的简单延时

$(".container").click(function(){
   var $element = $(this);

   //check if element has green class --> remove green class with a delay
   if ($element.hasClass('green')) {
     var delay = 1000; //ms
     setTimeout(function(){
         $element.removeClass('green');
     },delay );
   }
   // element doesn't have green class --> add it
   else {
     $element.addClass('green');
   }
});

fiddle

关于jquery - 是否可以仅向toggleClass的remove class部分添加延迟？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32455634/