使用JavaScript验证表单

完整版见https://jadyer.github.io/

验证表单中的文本输入域

<script language="javascript"> //判断是否为英文字母 function isEnglish(name){ if(0 == name.length){ return false; } for(i=0; i<name.length; i++){ if(65>name.charCodeAt(i) || 128<name.charCodeAt(i)){ return false; } } return true; } //判断是否为中文汉字 function isChinese(name){ if(0 == name.length){ return false; } for(i=0; i<name.length; i++){ if(128 < name.charCodeAt(i)){ return true; } } return false; } //判断sourceStr中是否包含errorStr中的某个字符 function contain(sourceStr, errorStr){ var i; for(i=0; i<errorStr.length; i++){ if(sourceStr.indexOf(errorStr.charAt(i)) >= 0){ return true; } return false; } } //用于判断手机号码或者银行帐号的函数。可扩展到域名注册等 function isNumber(String){ var c; var Letters = "0123456789"; //自定义可输入值。即只能为数字，适用于手机号或银行帐号的验证 if('0' == String.charAt(0)){ return false; //所输入的手机号码，不能以'0'开头 } /* if('0' == String.charAt(String.length-1)){ return false; //所输入的手机号码，不能以'0'结尾 } */ for(i=0; i<String.length; i++){ c = String.charAt(i); if(0 > Letters.indexOf(c)){ return false; //只能输入Letters中所限定的字符 } } return true; } //表单验证 function examine(){ if(""==document.form11.username.value || !isChinese(document.form11.username.value)){ alert("用户名不能为空，且只能为中文汉字"); document.form11.username.focus(); return false; } if(6<document.form11.username.value.length || 2>document.form11.username.value.length){ alert("用户名的中文字数仅限于2~~6个之间"); document.form11.username.focus(); return false; } if(""==document.form11.tel.value || !isNumber(document.form11.tel.value) || 11!=document.form11.tel.value.length){ alert("手机号码不能为空，且必须由11个阿拉伯数字组成，且手机号码的首位不能为零"); document.form11.tel.value = ""; document.form11.tel.focus(); return false; } if("" == document.form11.oldPassword.value){ alert("原始密码不能为空"); document.form11.oldPassword.focus(); return false; } if("" == document.form11.newPassword.value){ alert("新密码不能为空"); document.form11.newPassword.focus(); return false; } if("" == document.form11.reNewPassword.value){ alert("确认密码不能为空"); document.form11.reNewPassword.focus(); return false; } if(document.form11.newPassword.value != document.form11.reNewPassword.value){ alert("两次输入的新密码不一致"); document.form11.newPassword.value = ""; document.form11.reNewPassword.value = ""; document.form11.newPassword.focus(); return false; } //var idx = document.form11.email.value.indexOf("@"); //if(idx<=0 || idx==document.form11.email.value.length-1){// TODO....} if(null == document.form11.email.value.match("@") || contain(document.form11.email.value,"%/(/)><")){ alert("Email格式不正确"); document.form11.email.focus(); return false; } if(confirm("是否确定注册为本站会员？/n/n请确认！！")){ return true; }else{ return false; } } </script> <form name="form11" id="form11" action="#" method="POST"> 用户：<input type="text" name="username" id="username"/><br/> 手机：<input type="text" name="tel" id="tel"/><br/> 原密码：<input type="password" name="oldPassword" id="oldPassword"/><br/> 新密码：<input type="password" name="newPassword" id="newPassword"/><br/> 确认密码：<input type="password" name="reNewPassword" id="reNewPassword"/><br/> 邮箱地址：<input type="text" name="email" id="email"/><br/> <input type="button" value="测试表单验证" onClick="examine()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="submit" value="点我也可以验证" onclick="javascript:return examine()"/></form>

 

使用<input type="button"/>提交表单时，弹出的确认框

<script language="JavaScript"> function edit(){ document.forms[0].method.value="edit"; document.forms[0].submit(); } function del(){ if(confirm('您确定要删除所选中的评论吗？')){ document.forms[0].method.value="delete"; document.forms[0].submit(); } } </script> <form action="#" method="POST"> <input type="hidden" name="method" value=""> <input type="button" onclick="edit()" value="编辑" />     <input type="button" onclick="del()" value="删除" /> </form>

使用<a href="#"></a>链接发送请求时，弹出的确认框

<script type="text/javascript"> function del() { if (confirm("您确定要删除该篇文章吗？/n/n请确认！")){ return true; }else{ return false; } } </script> <a href="#" onclick="javascript:return del()"><img src="#" border="0" alt="删除"></a> <%-- 还有一种更简便的办法，如下所示 <a href="javascript:if(confirm('确定要删除吗?')){location='<%=request.getContextPath()%>/delete.jsp?isDelete=true&page=2'}">删除</a> --%>