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

Question

是否可以仅对 toggleClass 的删除 class 部分添加延迟？

在 fiddle 中，我希望红色 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');
});

Answer 1

显而易见的方法呢？

$(".container").click(function(){
   if ($(this).hasClass('green')) {
     // add your delay here
   }
   else {
     $(this).toggleClass('green');
   }
});

Answer 2

对于从绿色转换为红色的简单时间延迟

$(".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

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

Is it possible to add a delay to the remove class part of toggleClass only?

jquery

toggleclass