表单验证(无线电&组合框)在javascript

Form validation (radio & combobox) in javascript

本文关键字：javascript 组合 验证 无线电 表单      更新时间：2023-09-26

我正在尝试验证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代码:

<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>

请帮…

将if(document.form.country.selectedIndex=="")更改为if(document.getElementsByName("country").selectedIndex=="0")

您必须将检查选定索引的行更改为:

if(document.form.country.selectedIndex === 0)这是因为你的"请选择一个国家"条目，你将始终有一个选定的索引。

如果我在你的表单中添加<input type="submit" value="test"/>来测试提交，我会得到你的错误信息。

请参阅http://jsbin.com/oviped/2/edit它正在工作!

这是完整的代码，运行良好

<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>
相关文章：