jQuery 禁用jQuery中的按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15122526/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable button in jQuery
提问by user2047817
My page creates multiple buttons as id = 'rbutton_"+i+"'
. Below is my code:
我的页面创建多个按钮作为id = 'rbutton_"+i+"'
. 下面是我的代码:
<button type='button' id = 'rbutton_"+i+"' onclick=disable(i);>Click me</button>
In Javascript
在 JavaScript 中
function disable(i){
$("#rbutton'+i+'").attr("disabled","disabled");
}
But it doesn't disable my button when I click on it.
但是当我点击它时它不会禁用我的按钮。
回答by Blazemonger
Use .prop
instead (and clean up your selector string):
使用.prop
替代(和清理你选择的字符串):
function disable(i){
$("#rbutton_"+i).prop("disabled",true);
}
generated HTML:
生成的 HTML:
<button id="rbutton_1" onclick="disable(1)">Click me</button>
<!-- wrap your onclick in quotes -->
But the "best practices" approach is to use JavaScript event binding and this
instead:
但“最佳实践”方法是使用 JavaScript 事件绑定,this
而是:
$('.rbutton').on('click',function() {
$(this).prop("disabled",true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<button class="rbutton">Click me</button>
回答by Alessandro Minoccheri
Try this code:
HTML
试试这个代码:
HTML
<button type='button' id = 'rbutton_'+i onclick="disable(i)">Click me</button>
function
功能
function disable(i){
$("#rbutton_"+i).attr("disabled","disabled");
}
Other solution with jquery
使用 jquery 的其他解决方案
$('button').click(function(){
$(this).attr("disabled","disabled");
});
Other solution with pure javascript
使用纯 javascript 的其他解决方案
<button type='button' id = 'rbutton_1' onclick="disable(1)">Click me</button>
<script>
function disable(i){
document.getElementById("rbutton_"+i).setAttribute("disabled","disabled");
}
</script>
回答by Morvael
There are two things here, and the highest voted answer is technically correct as per the OPs question.
这里有两件事,根据 OP 问题,投票最高的答案在技术上是正确的。
Briefly summarized as:
简要概括为:
$("some sort of selector").prop("disabled", true | false);
However should you be using jQuery UI (I know the OP wasn't but some people arriving here might be) then while this will disable the buttons click event it wont make the button appear disabled as per the UI styling.
但是,您是否应该使用 jQuery UI(我知道 OP 不是,但有些人可能会到达这里),那么虽然这将禁用按钮单击事件,但它不会根据 UI 样式使按钮显示为禁用。
If you are using a jQuery UI styled button then it should be enabled / disabled via:
如果您使用的是 jQuery UI 样式的按钮,则应通过以下方式启用/禁用它:
$("some sort of selector").button("enable" | "disable");
回答by Lucas
This is the simplest way in my opinion:
这是我认为最简单的方法:
// All buttons where id contains 'rbutton_'
const $buttons = $("button[id*='rbutton_']");
//Selected button onclick
$buttons.click(function() {
$(this).prop('disabled', true); //disable clicked button
});
//Enable button onclick
$('#enable').click(() =>
$buttons.prop('disabled', false) //enable all buttons
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="rbutton_200">click</button>
<button id="rbutton_201">click</button>
<button id="rbutton_202">click</button>
<button id="rbutton_203">click</button>
<button id="rbutton_204">click</button>
<button id="rbutton_205">click</button>
<button id="enable">enable</button>
回答by MaryAnn
Try this
尝试这个
function disable(i){
$("#rbutton_"+i).attr("disabled",true);
}
回答by Cris
disable button:
禁用按钮:
$('#button_id').attr('disabled','disabled');
enable button:
启用按钮:
$('#button_id').removeAttr('disabled');
回答by George Pradeep
Simply it's work fine, in HTML:
简单地说,它工作正常,在 HTML 中:
<button type="button" id="btn_CommitAll"class="btn_CommitAll">save</button>
In JQuery side put this function for disable button:
在 JQuery 端,将此功能用于禁用按钮:
function disableButton() {
$('.btn_CommitAll').prop("disabled", true);
}
For enable button:
对于启用按钮:
function enableButton() {
$('.btn_CommitAll').prop("disabled", false);
}
That's all.
就这样。
回答by user890332
Here's how you do it with ajax.
以下是您如何使用 ajax 执行此操作。
$("#updatebtn").click(function () {
$("#updatebtn").prop("disabled", true);
urlToHandler = 'update.ashx';
jsonData = data;
$.ajax({
url: urlToHandler,
data: jsonData,
dataType: 'json',
type: 'POST',
contentType: 'application/json',
success: function (data) {
$("#lbl").html(data.response);
$("#updatebtn").prop("disabled", false);
//setAutocompleteData(data.response);
},
error: function (data, status, jqXHR) {
alert('There was an error.');
$("#updatebtn").prop("disabled", false);
}
}); // end $.ajax
回答by Pooja Mane
I want to disable button on some condition, i am using 1st solution but it won't work for me. But when I use 2nd one it worked.Below are outputs from browser console.
我想在某些情况下禁用按钮,我使用的是第一个解决方案,但它对我不起作用。但是当我使用第二个时它起作用了。下面是浏览器控制台的输出。
1. $('#psl2 .btn-continue').prop("disabled", true)
1. $('#psl2 .btn-continue').prop("disabled", true)
<a class=?"btn btn-yellow btn-continue" href=?"#">?Next?</a>?
2. $('#psl2 .btn-continue').attr("disabled","disabled")
2. $('#psl2 .btn-continue').attr("禁用","禁用")
<a class=?"btn btn-yellow btn-continue" href=?"#" disabled=?"disabled">?Next?</a>?
回答by Javi Ps
This works for me:
这对我有用:
<script type="text/javascript">
function change(){
document.getElementById("submit").disabled = false;
}
</script>