Javascript 未选中复选框时如何禁用提交按钮？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5458531/
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
How do i disable a submit button when checkbox is uncheck?
提问by pivotal developer
I have something herethat cannot seem to help me disable the submit button. any ideas?
我这里有些东西似乎无法帮助我禁用提交按钮。有任何想法吗？
<input type="checkbox" checked="checked" id="checky"><a href="#">terms and conditions</a>
<input type="submit" id="postme" value="submit">
$('#checky').click(function(){
if($(this).checked == false){
$('#postme').attr("disabled","disabled");
} else {
$('#postme').removeAttr('disabled');
}
});
回答by JohnP
You should be checking for the attribute checkedand not the method.
您应该检查属性checked而不是方法。
Updated fiddle : http://jsfiddle.net/8YBu5/7/
更新小提琴：http: //jsfiddle.net/8YBu5/7/
$('#checky').click(function(){
if($(this).attr('checked') == false){
$('#postme').attr("disabled","disabled");
} else {
$('#postme').removeAttr('disabled');
}
});
EDIT
编辑
Remember that this code needs to be wrapped inside $(document).ready()or put at the bottom of your html code, otherwise your JS will bind itself to DOM elements that have not been loaded yet and will fail.
请记住，此代码需要包裹在$(document).ready()您的 html 代码内部或放在底部，否则您的 JS 将自己绑定到尚未加载的 DOM 元素并失败。
Wrapping it in .ready()
将它包装在 .ready() 中
<script type='text/javascript'>
$(document).ready(function(){
$('#checky').click(function(){
if($(this).attr('checked') == false){
$('#postme').attr("disabled","disabled");
} else {
$('#postme').removeAttr('disabled');
}
});
});
</script>
This code can be put anywhere in the document and will only trigger once the DOM is ready so you don't have to worry about premature triggers.
此代码可以放在文档中的任何位置，并且只会在 DOM 准备就绪后触发，因此您不必担心过早触发。
Putting it at the bottom of your document
将其放在文档底部
<!-- some HTML -->
<script type='text/javascript'>
$('#checky').click(function(){
if($(this).attr('checked') == false){
$('#postme').attr("disabled","disabled");
} else {
$('#postme').removeAttr('disabled');
}
});
</script>
</body>
</html>
If you're putting it at the bottom of your document, you don't need to wrap it in .ready()because the javascript will not be read until everything else has loaded. There is a performance boost in this method (if you have a lot of JS)
如果您将它放在文档的底部，则不需要将其包装起来，.ready()因为在加载其他所有内容之前不会读取 javascript。这种方法有性能提升（如果你有很多 JS）
You can use either one of these methods to make sure that your JS binds event handling methods to DOM elements only afterthey have finished loading.
您可以使用其中任何一种方法来确保您的 JS 仅在加载完成后才将事件处理方法绑定到 DOM 元素。
回答by manji
if(!$(this).is(':checked') ...
回答by Santosh Linkha
回答by AnnMary
Try this
尝试这个
$(document).ready(function(){
$("#postme").attr("disabled","disabled");
$("#checky").click(function(){
if($("#checky").is(":checked")){
$("#postme").removeAttr("disabled");
}
else{
$("#postme").attr("disabled","disabled");
}
});
})
回答by Shaitender Singh
Try this way
试试这个方法
$('#checky').click(function(){
if(this.checked == false){
$('#postme').attr("disabled","disabled");
}
else {
$('#postme').removeAttr('disabled');
}
});
回答by Andrew Hymanman
Add to the button #postmea click event that checks if the check box is checked. If it is checked, return false, otherwise return true.
向按钮添加#postme一个单击事件，用于检查复选框是否被选中。如果选中，则返回false，否则返回true。
$('#postme').click( function () {
if ( !$('#checky').attr('checked') ) {
return false;
}
});
