前臺頁面JS驗證文字框非空,數值範圍選擇,單選框必選,複選框必選
阿新 • • 發佈:2018-11-14
前臺頁面JS驗證文字框非空,數值範圍選擇,單選框必選,複選框必選
<script type="text/javascript">
function check(){
var xm = document.getElementById("xm").value;
if(xm == null || xm == ''){
alert("使用者名稱不能為空" );
return false;
}
if(!document.getElementById("male").checked&&!document.getElementById("female").checked ){
alert("性別不能為空");
return false;
}
var csrq = document.getElementById("csrq").value;
if(csrq == null || csrq == ''){
alert("出生日期不能為空");
return false;
}
var fs =document.getElementById("fs").value;
if(fs == null || fs == ''){
alert("分數不能為空");
return false;
}
if(parseInt(fs) < 0||parseInt(fs)>999) {
alert("數值範圍不對");
return false;
}
var names = document.getElementsByName("aihao");
var flag = false ;//標記判斷是否選中一個
for(var i=0;i<names.length;i++){
if(names[i].checked){
flag = true ;
break ;
}
}
if(!flag){
alert("請最少選擇一項!");
return false ;
}
var slt=document.getElementById("liebiao");
if(slt.value==""){
alert("請選擇一個專案");
return false;
}
return true;
}
</script>
</head>
<body>
<form action="${pageContext.request.contextPath }/InsertStuServlet" method="get" onsubmit="return check()">
姓名<input name="xm" id="xm" type="text" /><br />
性別<input name="xb" id="male" type="radio" value="男" />男
<input name="xb" id="female" type="radio" value="女" />女<br />
出生日期<input name="csrq" id="csrq" type="text" class="Wdate" onClick="WdatePicker()" /><br />
分數<input name="fs" id="fs" type="text" /><br />
愛好:
<input name="aihao" type="checkbox" value="愛好1" />愛好1;
<input name="aihao" type="checkbox" value="愛好2" />愛好2;
<input name="aihao" type="checkbox" value="愛好3" />愛好3;<br>
選擇:
<select name="liebiao" id="liebiao">
<option value ="">-請選擇-</option>
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
<br>
<input name="" type="submit" value="提交" />
</form>
</body>