我的页面的表单验证[关闭]答案

【问题标题】：form validation for my page [closed]我的页面的表单验证[关闭]
【发布时间】：2014-05-23 11:10:59
【问题描述】：

谁能告诉我哪里出错了？

我为表单元素创建并检查四个元素，但不知何故，即使在我填写了四个元素之后，我仍然会弹出来完成表单

    <html>
    <head>
    <title>
    Page 3 - form validation
    </title>

    <script>
    function validateForm()
    {
    var x=document.forms["myForm"]["First Name"].value;
    if (x==null || x=="")
    {
    alert("Please fill the form");
    return false;
    }
    }
    </script>

    <script>
    function validateForm()
    {
    var x=document.forms["myForm"]["Last Name"].value;
    if (x==null || x=="")
  {
  alert("Please fill the form");
  return false;
  }
}
</script>

<script>
function validateForm()
{
var x=document.forms["myForm"]["designation"].value;
if (x==null || x=="")
  {
  alert("Please fill the form");
  return false;
  }
}    
</script>

<script>
function validateForm()
{
var x=document.forms["myForm"]["own"].value;
if (x==null || x=="")
  {
  alert("Please fill the form");
  return false;
  }
}
</script>
</head>

<body>

<h1> Please fill the form</h1>

<form name="myForm" action="helloworld.html" onsubmit="return validateForm()" method="post">
First name: <input type="text" name="First Name" /> <br>
<br>
Last name:  <input type="text" name="Last Name" />
<br>
<br>
Designation<br> <br>
<input type="radio" name="designation" value="Junior" /> Junior <br>
<input type="radio" name="designation" value="Senior" /> Senior <br>
<input type="radio" name="designation" value="Team Lead" /> Team Lead <br>
<input type="radio" name="designation" value="Manager" /> Manager <br>
<br>

What all do you own? <br>
<input type="checkbox" name="own" value="laptop" /> Laptop <br>
<input type="checkbox" name="own" value="Cell Phone" /> Cell Phone <br>
<input type="checkbox" name="own" value="Desktop" /> Desktop <br>
<input type="checkbox" name="own" value="Think Pad" /> Think Pad <br>
<input type="checkbox" name="own" value="Bike" /> Bike <br>
<input type="checkbox" name="own" value="Yamaha" /> Yamaha <br>

<br>
<br>

Select one of the following
<select>
<option value="Google"> Google </option>
<option value="Yahoo"> Yahoo </option>
<option value="Bing"> Bing </option>
<option value="Ask"> Ask </option>
</select>
<br>
<input type="submit" value="Submit" />
</form>

</body>
</html>

【问题讨论】：

一个函数不能多次使用同一个名字。

标签： javascript html forms validation

【解决方案1】：

问题在于您的复选框验证。试试这个-

What all do you own? <br>
<input type="checkbox" name="own" id="own1" value="laptop" /> Laptop <br>
<input type="checkbox" name="own" id="own2" value="Cell Phone" /> Cell Phone <br>
<input type="checkbox" name="own" id="own3" value="Desktop" /> Desktop <br>
<input type="checkbox" name="own" id="own4" value="Think Pad" /> Think Pad <br>
<input type="checkbox" name="own" id="own5" value="Bike" /> Bike <br>
<input type="checkbox" name="own" id="own6" value="Yamaha" /> Yamaha <br>

//复选框验证的Javascript代码-

<script>
function validateForm(){
     var flag=false;
     for (var i=1;i<7;i++){
     var el = document.getElementById('own'+i);
     if (el.checked) { 
        flag=true;
    }
  }
  if (!flag) { 
        alert("Please fill the form");
        return false;
    }
   }
 </script>

【讨论】：