Javascript Javascript复选框检查
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7866722/
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
Javascript checkbox checking
提问by thotheolh
I would like to use Javascript to check if a checkbox has been checked and if the checkbox is not check, the submission form would not continue until it is checked. Below are my codes.
我想使用 Javascript 来检查复选框是否被选中,如果复选框未被选中,提交表单将不会继续,直到被选中。下面是我的代码。
<SCRIPT language=javascript>
function checkAcknowledgement(checkbox){
alert(checkbox.toString());
if (checkbox.checked == false){
alert('Please read through the acknowledgement and acknowledge it.');
return false;
} else {
return true;
}
}
</script>
<form action="ioutput.php" method="POST">
<input name="form" type="hidden" id="form" value="true">
... some html form ...
<input type="checkbox" id="acknowledgement" value="1" /><br><br>
<input type="submit" value="submit" onclick="return checkAcknowledgement(this)"/>
</form>
Whenever the form is checked or not, it returns the alert warning that the form have not been checked despite me checking it manually. How should I fix it ?
无论何时检查表单,它都会返回警报警告,尽管我手动检查了该表单,但尚未检查该表单。我该如何解决?
回答by Rob W
You have to bind the event to the form instead of the submit button. Also, if you want the checkbox input to be submitted, attach a name instead of ID:
您必须将事件绑定到表单而不是提交按钮。此外,如果您希望提交复选框输入,请附加名称而不是 ID:
<input type="checkbox" name="acknowledgement" value="1" /><br><br>
<form action="ioutput.php" method="POST" onsubmit="return checkAcknowledgement(this)">
Then, modify the function:
然后,修改函数:
function checkAcknowledgement(form){
var checkbox = form["acknowledgement"];
alert(checkbox); //shows [HTMLInputElement]
if (!checkbox.checked){ //A shorter method for checkbox.checked == false
alert('Please read through the acknowledgement and acknowledge it.');
return false;
} else {
return true;
}
}
回答by Guffa
You are checking if the submit button is checked, which it naturally never will be.
您正在检查提交按钮是否被选中,这自然永远不会被选中。
Send the form to the function rather than the submit button itself:
将表单发送到函数而不是提交按钮本身:
<input type="submit" value="submit" onclick="return checkAcknowledgement(this.form)"/>
You need a name on the checkbox to find it:
您需要在复选框上输入名称才能找到它:
Use the form reference to access the checkbox:
使用表单引用访问复选框:
<script type="text/javascript">
function checkAcknowledgement(frm){
var checked = frm.acknowledgement.checked;
if (!checked){
alert('Please read through the acknowledgement and acknowledge it.');
}
return checked;
}
</script>
回答by Bao Nhan
Because you added that function in the onclick of the submit button, value of 'this' is not referring to the checkbox that you expect to receive it in the function. You can replace 'this' by document.getElementById('acknowledgement')
因为您在提交按钮的 onclick 中添加了该函数,所以“this”的值不是指您希望在函数中接收它的复选框。您可以用 document.getElementById('acknowledgement') 替换 'this'