javascript 中的表单验证（单选框和组合框）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14192818/
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
Form validation (radio & combobox) in javascript
提问by user1880157
I am trying to validate radiobuttons and optionbox in javascript. Here is the code but it is not working... Javascript Code for OprionBox and Radio:
我正在尝试在 javascript 中验证单选按钮和选项框。这是代码，但它不起作用...... OprionBox 和 Radio 的 Javascript 代码：
function checkCountry()
{
if(document.form.country.selectedIndex=="")
{
alert("Please select country from the list");
return false;
}
return true
}
function checkGender()
{
if(!document.getElementsByName("sex")[0].checked && !document.getElementsByName("sex")[1].checked)
{
alert("Select Male/Female");
return false;
}
return true;
}
function validate()
{
checkCountry();
checkGender();
}
HTML code:
HTML代码：
<form name="form" method="post" onSubmit="return validate()">
<select name="country">
<option value="select">(Please select a country)</option>
<option value="pk">Pakistan</option>
<option value="chn">China</option>
<option value="uk">United Kingdom</option>
<option value="usa">United States of America</option>
<option value="ir">Iran</option>
<option value="ma">Malaysia</option>
</select><br>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female<br></form>
Please help...
请帮忙...
回答by Chris
You'll have to change the line where you check for the selected index to:
您必须将检查所选索引的行更改为：
if(document.form.country.selectedIndex === 0)thats because of your "Please select a country" entry you will always have a selected index.
if(document.form.country.selectedIndex === 0)那是因为您的“请选择一个国家”条目，您将始终拥有一个选定的索引。
If i then add <input type="submit" value="test"/>inside your form to test submitting i will get your error messages.
如果我然后<input type="submit" value="test"/>在您的表单中添加以测试提交，我将收到您的错误消息。
Please see http://jsbin.com/oviped/2/editit is working!
请参阅http://jsbin.com/oviped/2/edit它正在工作！
回答by Cris
Change if(document.form.country.selectedIndex=="")to if(document.getElementsByName("country").selectedIndex=="0")
更改if(document.form.country.selectedIndex=="")为if(document.getElementsByName("country").selectedIndex=="0")
回答by Cris
This is whole code and its working fine
这是完整的代码并且它工作正常
<html>
<head>
<script type="text/javascript">
function checkGender()
{
if(!document.getElementsByName("sex")[0].checked && !document.getElementsByName("sex")[1].checked)
{
alert("Select Male/Female");
return false;
}
return true;
}
function checkCountry()
{
if(document.getElementsByName("country")[0].selectedIndex==0)
{
alert("Please select country from the list");
return false;
}
return true
}
function validate()
{
checkCountry();
checkGender();
}
</script>
</head>
<body>
<form onSubmit="return validate()" >
<select name="country">
<option value="select">(Please select a country)</option>
<option value="pk">Pakistan</option>
<option value="chn">China</option>
<option value="uk">United Kingdom</option>
<option value="usa">United States of America</option>
<option value="ir">Iran</option>
<option value="ma">Malaysia</option>
</select><br>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female<br>
<input type="submit" value="Submit" >
</form>
</body>
</html>
