如何使用jQuery触发CSS3缩放（动画）？

我想要实现的是动作上的脉动效果（例如点击按钮）。所以我做的是（简化[删除浏览器细节]）：

在jQuery中，我做到了：

$('#btn').click(function(e)){
    e.preventDefault();
    $('#some_element').addClass('pulse');
}

它工作正常，但只是第一次。。。一旦“脉冲”类被添加，它将不再触发。。。所以我想做的是：

$('#btn').click(function(e)){
    e.preventDefault();
    $('#some_element').removeClass('pulsate').addClass('pulsate');
}

但它仍然不起作用。。。与此相反：

$('#btn').click(function(e){
    e.preventDefault();     
    $('#some_element').toggleClass('pulsate');
}

第一次有效，第二次无效，第三次有效；所以基本上每隔一段时间

我很困惑。为什么它会以这种方式工作，而不删除并再次添加它？我甚至尝试创建一个重置类（再次简化）：

在jQuery中，我做了如下工作：

$('#btn').click(function(e)){
  e.preventDefault();
  $('#some_element').removeClass('pulsate').addClass('reset_transform').addClass('pulsate');
}

但正如你所能想象的，它不起作用。。。有什么想法吗？我希望每次单击按钮时该元素都会脉动。

ToggleClass（）

不起作用，因为当您第一次单击它时，它添加了类并播放了动画。当您第二次单击时，它删除了该类，而这一次，该类被删除，这就是它不播放动画的原因。第三次时，它的工作原理与第一次相同，此过程将继续：/

$('#btn').click(function(e)){

    e.preventDefault();

    $('#some_element').addClass('pulse').delay(200).removeClass('pulse');
}

---

我不这么认为，上面的代码会起作用！：）

这就是我问题的解决办法。正如@Aspiring Aqib指出的，我需要在添加和删除类之间进行延迟。他使用了delay（）jquery，但它不起作用

下面是我使用setTimeout（）的解决方案

---

如果我记得很清楚的话，有一次我刚刚用jQuery将CSS属性（而不是类）添加到某个元素，并看到转换立即应用到它。这是一个输入错误吗<代码>$（“#btn”）。单击（函数（e））{你有一个额外的

）

是的，这是一个打字错误；）告诉你我在简化事情：）嗯，我的逻辑是它也应该…但它不是：（必须调试一点查看DOM，似乎延迟不是通过add/removeClass完成的…我想我需要做一个setTimeoutOK，setTimeout可以正常工作，但没有设置为200。因为它的脉动是总动画时间的2倍，是800ms…在更快的点击上有一个clearTimeout语句…整个事情实际上看起来有点过时了。）nt！谢谢！好吧！好吧！我不知道该编辑什么：）我删除我的答案？bcoz我不知道我的答案对你有什么帮助，我无法理解你的上述评论！因此，如果它对你有帮助，我应该删除我的答案！不要删除答案；）

$('#btn').click(function(e)){
  e.preventDefault();
  $('#some_element').removeClass('pulsate').addClass('reset_transform').addClass('pulsate');
}

$('#btn').click(function(e)){

    e.preventDefault();

    $('#some_element').addClass('pulse').delay(200).removeClass('pulse');
}

$('#some_element').addClass('pulsate');

setTimeout(function(){
   $('#some_element').removeClass('pulsate');
}, 800);