Question

使用JavaScript / jQuery禁用带有类<button>或<input>的{{1}}，<a>或.btn元素时，我感到很困惑

我使用了以下代码段来执行此操作：

.btn-primary

所以，如果我只是为我的元素提供$('button').addClass('btn-disabled'); $('button').attr('disabled', 'disabled'); $('button').prop('disabled', true);，它将在视觉上显示为禁用，但功能将保持不变，但仍然可以点击，这就是我添加的原因该元素的$('button').addClass('btn-disabled');和attr设置。

有没有人在那里过期同样的问题？这是否是正确的方法 - 使用Twitter的Bootstrap？

Answer 1

您只需要$('button').prop('disabled', true);部分，该按钮将自动获取已禁用的课程。

Answer 2

输入和按钮：

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

锚点：

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

签入firefox，chrome。

请参阅http://jsfiddle.net/czL54/2/

Answer 3

建立jeroenk's answer，这是破旧：

$('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

请参阅fiddle

Answer 4

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

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

截至目前，Twitter Bootstrap没有使用disabled属性禁用按钮功能的方法。

尽管如此，这对于他们实施到他们的JavaScript库中来说是一个很好的功能。

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

将任何属性添加到按钮/锚点/链接以禁用它，引导程序只是添加样式，用户仍然可以在仍有onclick事件时单击它。所以我的简单解决方案是检查它是否被禁用并删除/添加onclick事件：

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

在Twitter的Bootstrap中禁用按钮的最佳方法

6 个答案: