[英]How to disable bootstrap button after one click using javascript
How do I disable a Bootstrap button after it is clicked using Javascript. 使用Javascript单击后如何禁用Bootstrap按钮。 I am using the
onclick
event but it doesn't get disabled. 我正在使用
onclick
事件,但不会被禁用。
Code: 码:
<div class="panel-heading">
<div class="btn-group pull-right">
<a href="/assign" class="btn btn-success">Assign</a>
<a href="#" class="btn btn-primary" onclick="this.disabled=true">Upload</a>
</div>
</div>
$("#buttonid").on("click", function() {
$(this).prop("disabled", true);
});
add 加
$(this).prop("disabled",true);
to you click event function 给您单击事件功能
The following solution can be used when an element (eg button, or link) is rendered as an A (anchor) tag (eg command link-buttons in ASPX pages). 当元素(例如按钮或链接)呈现为A (锚)标签(例如ASPX页面中的命令链接按钮)时,可以使用以下解决方案。 (Anchors do not have an (HTML) disable attribute, so cannot simply be disabled by setting that attribute. Slightly confusingly, Bootstrap will make the button appear to be disabled, but in practice another click (or worse still, double-clicks) will cause an on-click or href (where this is actually "javascript:...") to be re-invoked.)
(锚点没有(HTML)禁用属性,因此不能简单地通过设置该属性来禁用。有点令人困惑的是,Bootstrap将使该按钮看上去已被禁用,但是实际上,再次单击(或者更糟糕的是,双击)导致点击或href(实际上是“ javascript:...”)被重新调用。)
NB: Needs jquery. 注意:需要jQuery。
Add the script from the jsfiddle reference below, to your master page or individual pages. 将以下jsfiddle参考中的脚本添加到您的母版页或单个页中。
Apply the disableafteroneclick class to any button rendered as an anchor (A) where you want to restrict second/double clicks 将disableafteroneclick类应用于要限制第二次/双击的任何显示为锚点(A)的按钮
Optionally, add to the a/button data-disabledtext attribute (this will replace the text on the button after the first click. (可选)添加到a / button data-disabledtext属性(这将替换第一次单击后按钮上的文本。
NB: The disabled nature of the button will only be removed when the page is re-rendered - so this is mostly used where (for example) a submit button which must be click only once, will move the user to another page. 注意:仅当重新渲染页面时,按钮的禁用性质才会被删除-因此通常用于(例如)必须单击一次的提交按钮将用户移至另一页面的情况。
You'll see I've used the lines: 您会看到我使用了以下行:
if ($(this).attr("href")) window.location = $(this).attr("href");
return false;
for the first click (where the invocation is needed) - which might have been replaced with simply: 第一次点击(需要调用)-可能已被简单地替换为:
return true;
...but discovered that this doesn't work for IE <= 8 - and our clients need to provide support for IE8! ...但是发现这不适用于IE <= 8的IE-我们的客户需要为IE8提供支持! If you know you won't need that, then you certainly could use the simplified code created by that replacement.
如果您知道不需要它,那么您当然可以使用该替换创建的简化代码。
Code is at: https://jsfiddle.net/robertgalesorguk/qbq1n369/4/ 代码位于: https : //jsfiddle.net/robertgalesorguk/qbq1n369/4/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.