有时候我们并不需要复杂的验证,去逐一判断表单元素的数据类型,只需要判断字段是否为空就行,以下是一个简单的通用验证,适用一些对数据安全性不太敏感的场合,使用jQuery实现。
验证规则:
1. 通过自定义属性empty验证元素是否为空,如empty=false表示不能为空,失败弹出提示消息
2. 通过自定义属性ctlname来为元素的字段命名,以便alert弹出定义好的提示信息
3. 通过自定义属性eqctl来验证密码字段,其值指向要重复输入元素的ID,用于确认密码输入
- function checkform(formobj){
- var ret=false;
- var condcnt=0,passcnt=0;
- $(formobj).find("input,select").each(function(){
- if($(this).attr("empty")){
- if($(this).attr("empty")=="false"){
- condcnt++;
- var val=$(this).val();
- if(val.length>0){
- passcnt++;
- }else{
- alert($(this).attr("ctlname")+"不能为空!"); return false;
- }
- }
- }
- if($(this).attr("eqctl")){
- condcnt++;
- if($(this).val()==$("#"+$(this).attr("eqctl")).val()){
- passcnt++;
- }else{
- alert($("#"+$(this).attr("eqctl")).attr("ctlname")+"与"+$(this).attr("ctlname")+"输入不一致!"); return false;
- }
- }
- });
- if(condcnt==passcnt) ret=true;
- return ret;
- }
页面代码:
- <form method="post" action="action.asp?act=add" onsubmit="return checkform(this)">
- 用户名:<input ctlname="用户名" empty="false" name="user_name" id="user_name" type="text" />
- 登陆密码:<input ctlname="登陆密码" empty=false name="user_pwd" id="user_pwd" type="password" />
- 确认密码:<input ctlname="确认密码" empty=false eqctl="user_pwd" name="user_pwd2" id="user_pwd2" type="password" />
- <input type="submit" value="确认提交" />
- </form>