페이지의 많은 ID에 효과 적용

Question

잘 작동하는 버튼 (부트 스트랩 v.3)에 로딩 효과를 사용하고 있습니다.

<a href="#" class="btn btn-primary" role="button" id="fat-btn" >Read</a> 

과 스크립트는

 $('#fat-btn').click(function() { 
      var btn = $(this) 
      btn.button('loading') 
      setTimeout(function() { 
       btn.button('reset') 
      }, 9000)    
     }); 

이 잘 작동합니다! 하지만 내 페이지의 첫 번째 버튼에만 적용됩니다. 더 많은 버튼에이 효과를 적용하려면 어떻게해야합니까? 나는 비슷한 스크립트를 입력 할 수 있지만 다른 선택자를 사용할 수 있다고 생각했습니다. 그러나 이것은 편리하지 않습니다. (20 개의 버튼이있는 경우 20 개의 다른 선택자를 입력합니다.)

Answer 1

id selector 대신 class selector을 사용하고 이미 가지고있는 모든 버튼에 같은 ​​클래스를 지정하십시오.

$('.btn-primary').click(function() { 
    var btn = $(this); 
    btn.button('loading'); 
    setTimeout(function() { 
     btn.button('reset'); 
    }, 9000);    
}); 

Answer 2

대신

$('.btn').click(function() { 
     var btn = $(this) 
     btn.button('loading') 
     setTimeout(function() { 
      btn.button('reset') 
     }, 9000)    
    });