Javascript 禁用Twitter上的按钮的最佳方式'；s引导

当涉及到使用JavaScript/jQuery禁用

、

或带有类的

.btn

或

.btn primary

元素时，我感到困惑

我使用了以下代码片段来实现这一点：

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

因此，如果我只提供

$（'button'）.addClass（'btn-disabled'）到我的元素中，它将在视觉上显示为禁用，但功能将保持不变，并且它将不可点击，因此这就是我向元素添加
attr
和
prop
设置的原因

有没有人把这一期过期了？使用Twitter的引导程序时，这是正确的方法吗？
您只需要
$（'button'）.prop（'disabled'，true）部分，按钮将自动接受禁用类。
最简单的方法是使用
disabled
属性，就像您在原始问题中所做的那样：

按钮的内容

到目前为止，Twitter引导还没有一种方法可以在不使用
disabled
属性的情况下禁用按钮的功能

尽管如此，对于他们来说，这将是一个很好的功能，可以在javascript库中实现。
在按钮/锚定/链接中添加了什么属性来禁用它，bootstrap只是向它添加样式，用户仍然可以在仍然有onclick事件的情况下单击它。因此，我的简单解决方案是检查它是否被禁用，并删除/添加onclick事件：

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

对于输入和按钮：

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

对于锚：

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

登录firefox、chrome

请参见建筑工程，以下是详细说明：

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

请参见

活跃的
残废
可以在任何附加事件上检查hasclass，但如果使用href，则我不会sure@ZachLeighton-说到“a”，你必须为点击操作提供一个事件处理程序。我认为你不能禁用链接。我发现，如果你绑定到点击事件并调用event.preventDefault（），你实际上可以禁用链接。但如果这在所有浏览器中都不起作用，我也不会感到惊讶。这不是重复的。引用的重复项不包括问题中所述的类为“btn”或“btn btn primary”的“a”href元素的情况。OP的代码段是什么doing@Eonasdan正确，因为那是达到他想要的结果的最好方法。我只是简单地重申了他所做的是正确的。（很抱歉，如果你看到向下投票通知，我点击了错误的东西）对锚不起作用，请参阅我的回答。要停止点击事件触发，请添加一个包含
指针事件：none
的类，如将此样式添加到css
a[disabled]{pointer events:none；}
我刚刚用bootstrap3和
$（'.button'）.prop（'disabled'，true）尝试了这个方法停止单击事件传播，即引导为您处理。不适用于
，例如模式中的关闭按钮。有人知道怎么做吗？很好的例子$（#button-2'）。attr（'disabled'，'disabled'）对按钮和链接都有效。@msanjay:No-小提琴使用引导2，在视觉上禁用链接/锚，但在功能上不禁用它们，如注释所示。如果您将其更改为BS3，它也会在功能上禁用它们。EML提出了一个重要的观点。在bootstrap3中，设置disabled属性就足够了，bootrap3将为您处理其余的部分。但是在jQuery和HTML（没有Bootstrap 3）中，这是不够的。您可能是指
removeAttr
而不是
removeAttr
。是的，.removeAttr（）是可能不会删除onclick事件的方法名，附带on（）调用。这个问题的真正解决方案。不需要JQuery。这实际上是引导按钮的正确解决方案。不适用于Chrometh。这不会阻止触发单击事件。设置disabled=“disabled”可防止触发单击事件。当您将单击处理程序添加到禁用的锚链接时，它不应工作。但在您提供的示例中，也会触发click处理程序。这对于引导3来说似乎足够了。看起来bootstrap正在将btn设置为视觉禁用，这也阻止了click事件的触发。在没有bootstrap3的纯jQuery和HTML中，例如一些fiddle示例，这似乎是一个更复杂的故事。但这个问题是在引导的背景下提出的。
<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>