<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title id="titles">asdsa</title>
<script src="jquery-1.9.1.min.js"></script>
<script src="EuiValidata.js"></script>
<script language="JavaScript" type="text/javascript">
$().ready(function(){
$("#euiform").valiData();
});
</script>
</head>
<body>
<form id="euiform" action="http://baidu.com" method="post">
<input type="text" id="uname" check="required" ajaxUrl="baidu.com">
<input type="text" id="age" check="required">
<input type="text" id="sex" check="required">
<input type="text" id="addr" check="required">
<input type="submit" value="提交" >
</form>
</body>
</html>
(function($){
$.fn.valiData = function(options){
//当前表单对象
var root = this;
var formid = JSON.stringify(root.selector).replace(/\"/g, "");
var zflas = false;
var defaults = {
//错误图片地址
img_error:"",
//验证通过图片地址
img_success:"",
//提示信息
success: '',
//验证成功时的提示信息,默认为空
required: '不能为空',
email: '邮箱地址格式有误',
num: '请填写数字',
chinese: '请填写中文',
mobile: '手机号码格式有误',
idcard: '身份证号码格式有误',
pwdequal: '两次密码不一致',
//正则
email: /^\w+\@[a-zA-Z0-9]+\.[a-zA-Z]{2,4}$/i,
//验证邮箱
num: /^\d+$/,
//验证数字
chinese: /^[\u4E00-\u9FA5]+$/,
//验证中文
mobile: /^1[3458]{1}[0-9]{9}$/,
//验证手机
idcard: /^\d{14}\d{3}?\w$/ //验证身份证
};
//获取对应form表单下 添加验证的元素
$(""+formid+" [check]").each(function(){
//给每个元素添加事件 失去焦点时触发
$(this).blur(function(){
var arr = $(this).attr("check").split(" ");
for(var x=0;x<arr.length;x++){
if(checkVali($(this),arr[x])){
zflas = true;
}
}
});
});
//点击提交 验证
var _submit_Vlai = function(){
$(""+formid+" [check]").each(function(){
//验证 添加验证标识的 标签
if($(this).attr("check")){
var arr = $(this).attr("check").split(" ");
for(var x=0;x<arr.length;x++){
if(checkVali($(this),arr[x])){
zflas = true;
}
}
}
});
}
//判断是不是表单 是提交验证
if (root.is("form")) {
root.submit(function() {
//提交之前在检测一遍
_submit_Vlai();
return zflas;
})
}
//处理 数据验证
var checkVali = function(obj,str_info){
switch(str_info){
case "required":
return obj.val() == "" ? showMsg(obj,defaults.required,false) : showMsg(obj,defaults.success,true)
break;
case "ajax":
//走对应的路径去后台验证
/*$.ajax(function(){
type:"post",
url:obj.attr("ajaxUrl"),
data:{
//假如是验证用户名重复
uname:obj.val()
},
dataType:"json",
success:function(data){
//处理返回的数据
//return true || false
}
});*/
break;
//以下的 就不处理了
case "email":
break;
case "pwd":
break;
case "tel":
break;
case "num":
break;
//暂时不处理默认的
}
}
//显示成功失败信息 返回 true ||false
var showMsg = function(obj, msg, mark) {
$(obj).next("#errormsg").remove(); //先清除
var _html = "<span id='errormsg' style='font-size:13px;color:gray;background:url(" + defaults.img_error + ") no-repeat 0 -1px;padding-left:20px;margin-left:5px;'>" + msg + "</span>";
if (mark) _html = "<span id='errormsg' style='font-size:13px;color:gray;background:url(" + defaults.img_success + ") no-repeat 0 -1px;padding-left:20px;margin-left:5px;'>" + msg + "</span>";
$(obj).after(_html); //再添加
return mark;
}
}
})(jQuery);