在Twitter的Bootstrap中禁用按钮的最佳方法[重复]

2020/10/08 22:20 · javascript ·  · 0评论

当谈到禁用我很困惑<button><input>或者一个<a>:用类元素.btn或者.btn-primary,用JavaScript / jQuery的。

我使用以下代码片段来做到这一点:

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

因此,如果我仅向$('button').addClass('btn-disabled');元素提供,则它在外观上将显示为已禁用,但功能将保持不变,并且仍然可以单击,因此这就是我将attrprop设置添加到元素的原因。

有没有人使这个问题过期?这是正确的方法吗-在使用Twitter的Bootstrap时?

您只需要$('button').prop('disabled', true);零件,按钮将自动接受已禁用的课程。

对于输入和按钮:

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

对于锚点:

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

检入Firefox,镀铬。

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

建立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

小提琴

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

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

到目前为止,Twitter Bootstrap还没有一种无需使用disabled属性即可禁用按钮功能的方法

尽管如此,对于他们来说,这对于实现到自己的javascript库中来说将是一个很棒的功能。

<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>

曾经将任何属性添加到按钮/锚定/链接以禁用它,引导程序只是向其添加样式,并且当仍有onclick事件时,用户仍然可以单击它。所以我的简单解决方案是检查它是否已禁用并删除/添加onclick事件:

if (!('#button').hasAttr('disabled'))
 $('#button').attr('onclick', 'someFunction();');
else
 $('#button').removeattr('onclick');
本文地址:http://javascript.askforanswer.com/zaitwitterdebootstrapzhongjinyonganniudezuijiafangfazhongfu.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!