2

我正在使用 Bootstrap 的按钮

我在按钮上附加了一个自定义事件

$('.btn').bind('update', function(){
  // here I check if the button has the "Active" class and do something
});

$('.btn').click(function(){
  // here I trigger my event
  $(this).trigger('update');
});

所以 Bootstrap 的点击事件应该添加活动类,但它似乎在我的事件之后这样做,所以我的活动类似乎没有在我的事件中设置:|

我可以在引导程序的点击事件之后以某种方式运行我的点击事件吗?


测试:

http://jsfiddle.net/V55ZH/

如您所见,警报在设置“活动”类之前触发,因此在 Bootstrap 的点击事件运行之前(从我的事件来看,类状态对我来说是不可靠的)

4

1 回答 1

-1

快速浏览一下 bootstrap 的 JS 代码(https://github.com/twitter/bootstrap/blob/master/js/bootstrap-button.js) - 您可以注意到事件实际上不是直接附加在按钮元素上,而是在它的容器上。在您的示例中实际发生的是,引导程序使用“btn-group”类的容器 DIV 和属性 data-toggle="buttons-checkbox" 包装按钮。单击后,事件处理程序将被触发,您可以使用事件对象获取单击的按钮。

HTML

<div class="btn-group" data-toggle="buttons-checkbox">
  <button class="btn active">A</button>
  <button class="btn active">B</button>
  <button class="btn active">C</button>
  <button class="btn">D</button>
</div>

JS

$(document).ready(function(){
  $('body').on('click', '[data-toggle^=button]', function(e) {
      var btn = $(e.target);
      if (btn.hasClass('btn')) {
          alert(btn.hasClass('active'));
      }
  });
});
于 2012-08-09T18:52:26.120 回答