原文出处:http://www.cnblogs.com/xudong-bupt/p/3949631.html
可以使用form表单的onsubmit方法,在提交表单之前,对表单或者网页中的数据进行检验。
onsubmit指定的方法返回true,则提交数据;返回false不提交数据。
直接看下面的代码:
1 <HTML> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 4 </head> 5 <BODY> 6 <form action="http://www.baidu.com" onsubmit="return toVaild()"> 7 <input type="text" id="ff"> 8 <input type="submit" id="submit" value ="提交"/> 9 </form> 10 </BODY> 11 <script language="javascript"> 12 function toVaild(){ 13 var val = document.getElementById("ff").value; 14 alert(val); 15 if(val == "可以提交"){ 16 alert("校验成功,之后进行提交"); 17 return true; 18 } 19 else{ 20 alert("校验失败,不进行提交"); 21 return false; 22 } 23 } 24 </script> 25 </HTML>
上面的网页中,只有在id="ff"的输入框中输入“可以提交”,才进行表单提交;否则不提交。
另外在百度找个这个感觉更通用例子:
原文出处:http://zhidao.baidu.com/link?url=VHymqpRQX4JTabFf9ex9dfnS3HyqsK1FSBZUCXmEwUuoZDIJkMrfPYzcQ80Nv61S5l_s4_1_ycZE1iYs80BLJ_TYkPFXKDIv_BE6eNnyC0K
<form id="form">
<input name="user" message="账号" value=""/>
<input name="name" value=""/>
<input type="button" onClick="checkStart()" value="save" />
</form>
<script>
function checkStart(){
check(form);
}
function check(form) {
for (i=0;i<form.length;i++){
var ele = form.elements[i];
var msg = ele.getAttribute('message');
if(msg && ele.value == ""){
alert(msg + "不能为空!");
form.elements[i].focus();
return false;
}
}
form.submit();
}
思路: 在需要验证的input 或者select 添加一个message的属性
验证的时候 检查有属性就判断是否为空 提示用message的汉字 一般的name也是字母 提示别人看不懂