通用按钮自添加类

Question

是否可以为我代码中具有不同ID的基本上所有按钮制作通用的jQuery？ 我似乎无法使它工作。 我试图实现的是每次单击按钮时，javascript都会为该特定按钮添加一个类。

HTML：

<button type="button" onClick="myFunction(this.id)" id="test1" class="btn btn-primary btn-xs pull-right">button 1</button>
<button type="button" onClick="myFunction(this.id)" id="test2" class="btn btn-primary btn-xs pull-right">button 2</button>
<button type="button" onClick="myFunction(this.id)" id="test2" class="btn btn-primary btn-xs pull-right">button 2</button>

JS：

function myFunction(this) {
     $(this).addClass("animated flipInY");
  setTimeout(function(){
     $(this).removeClass("animated flipInY")

  },1000); 
}

Answer 1

您可以将click event与button选择器一起使用，它将对您的所有按钮都有效：

$('button').on('click', function(){
     $(this).addClass('animated flipInY');
}

希望这可以帮助。

Answer 2

我认为您遇到的问题与为所有按钮调用“ removeClass”更相关...

为此，您需要更改

setTimeout(function(){
     $(this).removeClass("animated flipInY")
  },1000); 

至

setTimeout(function(){
     $('button').removeClass("animated flipInY")    
  },1000); 

在您的代码中（或最好将其添加到Zakaria答案中）。