javascript 根据无线电输入条件禁用和启用按钮提交
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18873134/
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
Disabling and enabling button submit based on radio input conditions
提问by samayo
I would like to disable an input field from being click-able if user hasn't selected a radio button. Here is the simple HTML form:
如果用户未选择单选按钮,我想禁用可点击的输入字段。这是一个简单的 HTML 表单:
<form method="POST">
<input type='radio' name='a' value='a' id='checkMe' /> a
<input type='radio' name='a' value='b' id='checkMe' /> b
<input type='radio' name='a' value='c' id='checkMe' /> c
<input type='submit' value='choose' id='choose' disabled="disabled"/>
</form>
Now, I made this js, to see if one of the inputs is selected, then the disabled="disabled"
part should be revered, but that is now the case in this JavaScript code
现在,我制作了这个 js,以查看是否选择了其中一个输入,然后该disabled="disabled"
部分应该受到尊重,但现在这个 JavaScript 代码就是这种情况
if(document.getElementById('checkMe').checked) {
document.getElementById('choose').disabled=false;
}
Here is the online demo. http://jsfiddle.net/2HC6s/
这是在线演示。http://jsfiddle.net/2HC6s/
回答by devo
<!DOCTYPE html>
<html>
<head>
<title>Stack</title>
<script>
function set_btn_status()
{
var radios = document.getElementsByName("a");
for (var i = 0; i < radios.length; i++) {
if (radios[i].checked) {
var checked_value = radios[i].value;
if(checked_value == 'a') {
document.getElementById('choose').disabled = false;
} else {
document.getElementById('choose').disabled = true;
}
break;
}
}
}
</script>
</head>
<body>
<form method="POST">
<input type='radio' name='a' value='a' id='checkMe' onclick="set_btn_status()"/> a
<input type='radio' name='a' value='b' id='checkMe1' onclick="set_btn_status()"/> b
<input type='radio' name='a' value='c' id='checkMe2' onclick="set_btn_status()"/> c
<input type='submit' value='choose' id='choose' disabled="disabled"/>
</form>
</body>
</html>
回答by Shadow
Try this | demo
试试这个 | 演示
<form method="POST" id="question">
<input type='radio' name='a' value='a' id='checkMe' onclick="check()"/> a
<input type='radio' name='a' value='b' id='checkMe1' onclick="check()" /> b
<input type='radio' name='a' value='c' id='checkMe2' onclick="check()" /> c
</br>
function check()
{
var ele = document.getElementsByName('a');
var flag=0;
for(var i=0;i<ele.length;i++)
{
if(ele[i].checked)
flag=1;
}
if(flag==1)
document.getElementById('choose').disabled=false;
}
回答by dinafication
Put it inside a table and then do on her:
把它放在一张桌子里,然后在她身上做:
var tabPom = document.getElementById("pomTableId");
$(tabPom ).prop('disabled', true/false);
回答by Sarath Kumar
<form method="POST" id="question">
<input type='radio' name='a' value='a' id='checkMe' /> a
<input type='radio' name='a' value='b' id='checkMe' /> b
<input type='radio' name='a' value='c' id='checkMe' /> c
</br>
<input type='submit' value='choose' id='choose' disabled="disabled"/>
</form>
<script>
document.getElementById('checkMe').onclick = function() {
document.getElementById('choose').disabled=false;
}
</script>