2012-06-22 111 views
3

我想使用這個鏈接作爲我的資源:http://www.w3schools.com/js/js_form_validation.asp的Javascript複選框表單驗證

我理解它是如何工作的文本框,但是你怎麼讓它檢測表單驗證的複選框?例如,如果我有一個排列着複選框的頁面(所有頁面都具有相同的「名稱」值),我想確保至少有一個框被選中...我該怎麼做?如果複選框未被選中,以及javascript應該如何捕獲,我對發送post請求有點困惑。謝謝。

編輯----

得到它的工作,這裏是爲未來的人們一些代碼:

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript"> 
function Validate(){ 
    if(!validateForm()){ 
     alert("Something happened"); 
     return false; 
    } 
return true 
} 
function validateForm() 
{ 
    var c=document.getElementsByTagName('input'); 
    for (var i = 0; i<c.length; i++){ 
     if (c[i].type=='checkbox') 
     { 
      if (c[i].checked){return true} 
     } 
    } 
    return false; 
} 
</script> 
</head> 
<body> 
<form name="myForm" action="demo_form.asp" onsubmit="return Validate()" method="post"> 
Value: <input type="checkbox" name="fname" value="value"> 
Value2: <input type="checkbox" name="fname" value="value2"> 
...<more boxes here> 
<input type="submit" value="Submit"> 
</form> 
</body> 
</html> 

回答

1

這裏是做你的要求,並可以在此頁面中進行測試的例子:

function Validate(){ 
 
    if(!validateForm()){ 
 
     alert("You must check atleast one of the checkboxes"); 
 
     return false; 
 
    } 
 
return true 
 
} 
 
function validateForm() 
 
{ 
 
    var c=document.getElementsByTagName('input'); 
 
    for (var i = 0; i<c.length; i++){ 
 
     if (c[i].type=='checkbox') 
 
     { 
 
      if (c[i].checked){return true} 
 
     } 
 
    } 
 
    return false; 
 
}
<form name="myForm" action="demo_form.asp" onsubmit="return Validate()" method="post"> 
 
Option 1: <input type="checkbox" name="option1" value="1"><br /> 
 
Option 2: <input type="checkbox" name="option2" value="2"><br /> 
 
<input type="submit" value="Submit Form"> 
 
</form>

0

function ValidateForm(form){ 
 
ErrorText= ""; 
 
if ((form.gender[0].checked == false) && (form.gender[1].checked == false)) 
 
{ 
 
alert ("Please choose your Gender: Male or Female"); 
 
return false; 
 
} 
 
if (ErrorText= "") { form.submit() } 
 
}
<form name="feedback" action="#" method=post> 
 
Your Gender: <input type="checkbox" name="gender" value="Male"> Male 
 
<input type="checkbox" name="gender" value="Female"> Female 
 

 
<input type="reset" value="Reset"> 
 
    <input type="button" name="SubmitButton" value="Submit" onClick="ValidateForm(this.form)"> 
 
</form>