javascript javascript复选框验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10268599/
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 validation
提问by pepsicode
The validation of the checkbox doesn't work. It doesn't give any error. Could you please help me to fix it? And how can I combine errors in one alert instead of one by one?
复选框的验证不起作用。它不会给出任何错误。你能帮我修一下吗？以及如何将错误合并到一个警报中而不是一个一个？
Thanks for any help.
谢谢你的帮助。
Html code:
html代码：
<form class="contact_form" action="" method="post" name="contact_form" onsubmit="returnonFormSubmit(this)">
<li>
<label for="First Name">First Name:</label>
<input type="text" name="visitor_name" /><br />
</li>
<li>
<label for="condition">I agree with the terms and conditions.</label>
<input type="checkbox" name="lan" /><br />
</li>
<li>
<label for="Male">Male:</label>
<input type="radio" name="gender" value="m" /> Female:<input type="radio" name="gender" value="f" /><br />
</li>
<li>
<label for="National Rating">National Rating:</label>
<select name="make">
<option selected>-- SELECT --</option>
<option> Below 1200 </option>
<option> 1200 - 1500 </option>
<option> 1500 - 1800 </option>
<option> 1800 - 2100 </option>
<option> Above 2100 </option>
</select><br />
</li>
<li>
<button class="submit" type="submit">Submit</button>
</li>
<div id="error_message" style="color:#ff0000;"></div>
javascript code:
javascript代码：
function onFormSubmit(form_element)
{
var checked = 0;
var letters = /^[a-zA-Z]+$/;
if (form_element.visitor_name.value.match(letters))
{
true;
}
else
{
alert("Please enter a valid first name. For example; John.");
false;
}
if (form_element.lan.checked == false)
{
alert("Please accept the terms and conditions");
false;
}
if (form_element.gender[0].checked == false && form_element.gender[1].checked == false)
{
alert("Please select a gender.");
false;
}
if (form_element.make.selectedIndex == 0)
{
alert("Please select your rating interval.");
form_element.make.focus();
false;
}
return true;
}
回答by Kleist
You have a typo in onsubmit="returnonFormSubmit(this)". It should be
你有一个错字onsubmit="returnonFormSubmit(this)"。它应该是
onsubmit="return onFormSubmit(this)"
Running this with a console open would give you a valuable error/warning. Try Chrome's Developer Tools, Firefox' Firebug or similar.
在控制台打开的情况下运行它会给你一个有价值的错误/警告。试试 Chrome 的开发者工具、Firefox 的 Firebug 或类似工具。
To combine the errors into one, you could start out with an empty string msg = ''and append to it if there is an error. Then at the bottom of your function, alert(msg)and return false if it is non-empty, otherwise return true.
要将错误合并为一个，您可以从一个空字符串开始，msg = ''并在出现错误时附加到它。然后在你的函数底部，alert(msg)如果它非空则返回false，否则返回true。
回答by jorgebg
You should concatenate the error messages in a variable.
您应该将错误消息连接到一个变量中。
function onFormSubmit(form_element)
{
var checked = 0;
var letters = /^[a-zA-Z]+$/;
var errorMessage = "";
if (!form_element.visitor_name.value.match(letters))
{
errorMessage += "Please enter a valid first name. For example; John.\n";
}
if (form_element.lan.checked == false)
{
errorMessage += "Please accept the terms and conditions\n";
}
if (errorMessage != "")
{
alert(errorMessage);
return false;
}
return true;
}?
回答by Kveri
After fixing typo in returnonFormSubmit(this) it works in Chrome and Firefox.
在 returnonFormSubmit(this) 中修复错字后，它可以在 Chrome 和 Firefox 中使用。
(BTW: you forget returns)
（顺便说一句：你忘记了回报）
To combine alerts I would use an array. Example:
为了组合警报，我将使用一个数组。例子：
function onFormSubmit(form_element)
{
var checked = 0;
var letters = /^[a-zA-Z]+$/;
var alerts = new Array();
if (!form_element.visitor_name.value.match(letters))
alerts.push("Please enter a valid first name. For example; John.");
if (!form_element.lan.checked)
alerts.push("Please accept the terms and conditions");
if (alerts.length == 0) {
return true;
}
alert(alerts.join("\n"));
return false;
}
