在Twitter的Bootstrap中禁用button的最佳方法

我很困惑，当用JavaScript / jQuery来禁用类： .btn或.btn-primary的<button> ， <input>或<a>元素。

我已经使用以下代码片段来做到这一点：

 $('button').addClass('btn-disabled'); $('button').attr('disabled', 'disabled'); $('button').prop('disabled', true); 

所以，如果我只提供了$('button').addClass('btn-disabled'); 到我的元素，它将显示为禁用，在视觉上，但function将保持不变，这将是无可争辩的，所以这就是为什么我将attr和prop设置添加到元素的原因。

有没有人在那里过期了这个相同的问题？ 这是做这个的正确方法 – 使用Twitter的Bootstrap？

Answer 1

你只需要$('button').prop('disabled', true); 部分，该button将自动采取禁用类。

Answer 2

对于input和button：

  $('button').prop('disabled', true); 

对于主播：

  $('a').attr('disabled', true); 

检查在Firefox，铬。

见http://jsfiddle.net/czL54/2/

Answer 3

build立jeroenk的答案 ，这里的概要 ：

 $('button').addClass('disabled'); // Disables visually $('button').prop('disabled', true); // Disables visually + functionally $('input[type=button]').addClass('disabled'); // Disables visually $('input[type=button]').prop('disabled', true); // Disables visually + functionally $('a').addClass('disabled'); // Disables visually $('a').prop('disabled', true); // Does nothing $('a').attr('disabled', 'disabled'); // Disables visually 

看小提琴

Answer 4

最简单的方法就是使用disabled属性，就像你在原来的问题中所做的那样：

<button class="btn btn-disabled" disabled>Content of Button</button>

截至目前，Twitter Bootstrap没有禁用button的function而不使用disabled属性的方法。

不过，这将是他们实现到他们的JavaScript库的一个很好的function。

Answer 5

 <div class="bs-example"> <button class="btn btn-success btn-lg" type="button">Active</button> <button class="btn btn-success disabled" type="button">Disabled</button> </div> 

Answer 6

什么属性被添加到button/锚点/链接来禁用它，引导只是添加样式，用户仍然可以点击它仍然onclick事件。 所以我简单的解决scheme是检查是否被禁用，并删除/添加onclick事件：

 if (!('#button').hasAttr('disabled')) $('#button').attr('onclick', 'someFunction();'); else $('#button').removeattr('onclick');