重大更新
1.优化部分算法
2.支持行内元素校验定义
3.js添加元素，可添加定义事件
下载文件 前往下载 https://download.csdn.net/download/qq_28254093/10674828
内附详细教程
日期：2018-9-18
-------------------------------------------------------------分界线----------------------------------------------------------------------------------------------------------
如题，使用layer错误提示，那么layer使用的jquery的的要求是1.10以上版本，
所以使用的jQuery的的为1.10.0
支持：文本框，单选框，多选框，下拉框验证，文本域
如果需要详细用法，请查看文章后部分
效果图：
验证功能，
光标离开验证，数据保存验证
使用示例页面
<html>
<head>
<title>测试插件文本</title>
</head>
<body>
<br>
<br>
名称：<input type="text" id="name" ><br/>
密码：<input type="password" id="password" ><br/>
职业：<select id="textselect">
<option ></option>
<option value="1">士</option>
<option value="2">农</option>
<option value="3">工</option>
<option value="4">商</option>
</select><br/>
性别： <input name="sex" type="radio" value="1">男
<input name="sex" type="radio" value="2">女<br/>
证件类型：<input name="cardType" type="checkbox" value="1">军官证
<input name="cardType" type="checkbox" value="2">身份证
<input name="cardType" type="checkbox" value="3">户口本
<input name="cardType" type="checkbox" value="4">护照<br/>
<input type="button" id="saves" value="保存">
<script type="text/javaScript" src="../../js/jquery-1.10.1.min.js" media="all"></script>
<link href="../checkInput/css/layui.css"/>
<script src="../checkInput/layui.all.js" ></script>
<script type="text/javaScript" src="jQuery.checkinput.js"></script>
<!-- <link rel="stylesheet" type="text/css" href="/Member/resources/css/checkstyle.css"> -->
<script type="text/javaScript">
$(function(){
$(this)._initCheck([
{
selector:"#name",
checkType:["isInteger"],
message:"(必填)名称只能为数字",
//以下可选
maxLength:10,
minLength:5,
isEmpty:false,
checkBefore:function(obj,opt,flg){
console.log("这是调用之前执行的方法");
console.log(obj,opt,flg);
},
checkAfter:function(obj,opt,flg){
console.log("这是调用之后执行的方法");
console.log(obj,opt,flg);
},
cheCallback:function(obj,opt,flg){
console.log("验证时：这是在验证时调用的回调函数方法");
console.log(obj,opt,flg);
return flg;
}
},{
selector:"#password",
isEmpty:false,
checkType:["isAnyChar"],
message:"除特殊符号外的任意字符",
},{
selector:"#textselect",
isEmpty:false,
checkType:["isInteger"],
message:"请选择一项作为您的职业",
},{
selector:'[name="sex"]',
isEmpty:false,
checkType:["isInteger"],
message:"请选择性别",
},{
selector:'[name="cardType"]',
isEmpty:false,
checkType:["isInteger"],
message:"证件类型不能为空",
}
],function(obj,type,flg){
});
},[{path:"../layer.min.js",type:'js'}]);
$("#saves").click(function () {
alert($(this)._saveChe());
});
</script>
</body>
</html>使用的CSS（jquery.checkstyle.css）
.form-error {opacity: 0.87;position: absolute;display: block;text-align: left;cursor: pointer;z-index: 9999;}
/*left*/
.form-error .form-error-content {user-select: none;position: relative;width: 100%;min-width: 80px; padding: 4px 10px; border: 2px solid #FFC107; border-radius: 6px; background-color: #ff9800; box-shadow: 0 0 6px #FF5722; color: #fff; font: 12px/18px "\5b8b\4f53",Tahoma;}
.form-error .form-error-arrow {user-select: none; position: relative; margin: -2px 0 0 13px; width: 15px; }
.form-error .form-error-arrow div {display: block; height: 1px;margin: 0 auto;border-right: 2px solid #FFC107;border-left: 2px solid #FFC107;background-color: #ff9800;box-shadow: 0 2px 3px #FF5722;font-size: 0;font-size: 0;line-height: 0;}
.form-error .form-error-arrow .line10{width:15px;border:0;}
.form-error .form-error-arrow .line9{width:13px;border:0;}
.form-error .form-error-arrow .line8{width:11px;}
.form-error .form-error-arrow .line7{width:9px;}
.form-error .form-error-arrow .line6{width:7px;}
.form-error .form-error-arrow .line5{width:5px;}
.form-error .form-error-arrow .line4{width:3px;}
.form-error .form-error-arrow .line3{width:1px;border-right:2px solid #FFC107;border-bottom:0 solid #FFC107;border-left:2px solid #FFC107;}
.form-error .form-error-arrow .line2{width:3px;border:0;background-color:#ddd;}
.form-error .form-error-arrow .line1{width:1px;border:0;background-color:#ddd;}
/*right*/
.form-error .form-error-arrow-right{user-select: none;border: 1px solid #ffa622;width: 27px; height: 27px;border-radius: 50%;float: left;text-align: center;color: red;font-size: 16pt;}
.form-error .form-error-content-right {user-select: none;position: relative;width: 100%;min-width: 80px; padding: 4px 10px; border: 2px solid #FFC107;border-radius: 6px; background-color: #ff9800; box-shadow: 0 0 6px #FF5722; color: #fff; font: 12px/18px "\5b8b\4f53",Tahoma; margin-left: 30px;}
.layui-layer-tips {
background: 0 0;
box-shadow: none;
border: none
}
.layui-layer-tips .layui-layer-content {
position: relative;
line-height: 22px;
min-width: 12px;
padding: 8px 15px;
font-size: 12px;
_float: left;
border-radius: 2px;
box-shadow: 1px 1px 3px rgba(0,0,0,.2);
background-color: #FF9800;
color: #fff
}
.layui-layer-tips .layui-layer-close {
right: -2px;
top: -1px
}
.layui-layer-tips i.layui-layer-TipsG {
position: absolute;
width: 0;
height: 0;
border-width: 8px;
border-color: transparent;
border-style: dashed;
*overflow: hidden
}
.layui-layer-tips i.layui-layer-TipsB,.layui-layer-tips i.layui-layer-TipsT {
left: 5px;
border-right-style: solid;
border-right-color: #ff9800
}
.layui-layer-tips i.layui-layer-TipsT {
bottom: -8px
}
.layui-layer-tips i.layui-layer-TipsB {
top: -8px
}
.layui-layer-tips i.layui-layer-TipsL,.layui-layer-tips i.layui-layer-TipsR {
top: 5px;
border-bottom-style: solid;
border-bottom-color: #ff9800
}
.layui-layer-tips i.layui-layer-TipsR {
left: -8px
}
.layui-layer-tips i.layui-layer-TipsL {
right: -8px
}
使用JS（layer.all.js）
校验插件代码（jquery.checkinput.js）
/**
* 依赖项: 需引入jQuery文件,jquery版本在1.10以上(layui.js要求jquery版本在1.10.0以上) (需要手动引用，且必须在当前js插件之前)
* 和引入checkstyle.css文件 (默认已经引入，需要注意引入路径问题)
* 和引入layui.js文件 (默认已经引入，需要注意引入路径问题)
* 作 者: jpw
* 日 期: 2018-8-27 18:17:15
* 描 述: 校验用户输入信息
*/
;
//闭包限定命名空间
(function($){
//扩展jquery 方法
$.fn.extend({
/**
* 根据定义的校验信息进行校验信息
* @param optionArrays: 需要验证的参数配置，详情参考下文defaults对象， 形如
[{
selector:"#name",
isEmpty:false,
checkType:["notNull","isChinese"],
message:"(必填)请输入用户名称，名称只能为汉字"
checkBefore:function(obj,opt,flg){
console.log("这是调用之前执行的方法");
alert("这是调用之前执行的方法");
console.log(obj,opt,flg);
},
checkAfter:function(obj,opt,flg){
console.log("这是调用之后执行的方法");
console.log(obj,opt,flg);
alert("这是调用之后执行的方法");
},
cheCallback:function(obj,opt,flg){
console.log("这是回调函数的方法");
console.log(obj,opt,flg);
alert("这是回调函数的方法");
}
},
{....},
....
]
* @param resultsFn: 验证操作完成时执行的回调函数。回调函数返回参数： (验证元素,验证参数,验证结果)
* @param initFileArray: 初始化文件的数组配置 形如：[{path:"./style.css",type:'css'},{path:"https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js",type:'js'}]
*/
"_initCheck":function(optionArrays,resultsFn,initFileArray){
//初始化需要的文件
$._initExtendFile(initFileArray||[]);
$.each(optionArrays,function(index,options){
var _defaultOpts = $.extend({}, defaults, options); // 覆盖插件默认参数
var _selector=_defaultOpts["selector"];
var opts=chedefaultCache[_selector]=chedefaultCache[_selector]||_defaultOpts;
var $dom=$(_selector);
//注册光标进入事件
// $dom.focus(function(){
// var val=$dom.val();
// });
//注册光标离开事件 光标离开进行数据验证
$dom.blur(function(){
var flg= checkVal($dom);
var _selector=$dom["selector"];
var opts=chedefaultCache[_selector];
if(typeof resultsFn=="function"){
flg= resultsFn($dom,opts,flg)
}
return flg;
});
var cs=opts["checkCss"];
(typeof cs=="string"&&cs!=undefined)&&(cs=eval("("+cs+")"));
(cs!=undefined)&&($dom.css(cs));
});
},
/**
* 保存校验
* @param resultsFn ($dom【元素对象】,opts【元素校验配置参数】,flg【返回结果】)
* 校验元素完成返回结果之前执行 【回调函数】
*/
"_saveChe":function(resultsFn){
var flg=true;
for(var _selector in chedefaultCache){
var $dom=$(_selector);
if($dom==null||$dom==undefined){
continue;
}
flg= checkVal($dom);
if(flg==false){
return false;
}
var opts=chedefaultCache[_selector];
if(typeof resultsFn=="function"){
flg= resultsFn($dom,opts,flg)
}
}
return flg;
}
});
/**
* 校验数据
* @param {要校验的元素对象} $dom
*/
var checkVal=function($dom){
//判断元素状态，如果隐藏则不验证
if(!$dom.is(':visible')||$dom.is(':hidden')){
return true;
}
var _select=$dom["selector"];
var _opts=chedefaultCache[_select];
var before=_opts["checkBefore"];
(typeof before=="function")&&(before($dom,_opts,flg));
var valList=$._getVal($dom);
var val=valList[0];
var msg="";
var flg=true;
var _cheCall=_opts["cheCallback"];
if((_opts["isEmpty"]&&val=="")||(typeof val=="object"&&val.length<=0&&_opts["isEmpty"])){
flg=true;
}else{
if((!_opts["isEmpty"]&&val=="")||(!_opts["isEmpty"]&&typeof val=="object"&&val.length<=0)){
flg=false;
msg=valList[1]=="select"?"您还没有选择,请选择!"
:valList[1]=="radio"?"请选择一项!"
:valList[1]=="checkbox"?"请最少选中一个！"
:"必填项，不能为空！";
}else{
if(typeof val=="string"){
//校验长度
var cheType=_opts["checkType"];
max=_opts["maxLength"],min=_opts["minLength"];
var cheTypeStr=cheType.join(',');
if(cheTypeStr.indexOf("isInteger")>=0||cheTypeStr.indexOf("isDouble")>=0){
if(parseFloat(val)>max||parseFloat(val)<min){
flg=false;
msg="输入数介于"+min+"-"+max+"之间";
}
}else{
if(val.length>max||val.length<min){
flg=false;
msg="请输入 "+(min==max?min:(min+"-"+max))+" 位字符";
}
}
if(flg){
for(var i=0;i<cheType.length;i++){
var fun=cheType[i];
if(_cheType[fun]!=undefined){
flg=_cheType[fun](val,function(_val,_flg){
(typeof _cheCall=="function")&&(_flg=_cheCall($dom,_opts,_flg))
return _flg;
});
if(flg==false) break;
}else{
console.log("没有找到验证规则中包含："+fun);
}
}
}
}
}
}
//使用定义的样式显示错误信息
if(flg){
$._cheSuccess($dom,_opts["showType"],flg,val,msg==""?_opts["message"]:msg);
}else{
$._cheError($dom,_opts["showType"],flg,val,msg==""?_opts["message"]:msg);
}
var after=_opts["checkAfter"];
(typeof after=="function")&&(after($dom,_opts,flg));
return flg;
}
/**
* 缓存校验的配置信息
*/
var chedefaultCache={};
/**
* 校验参数设置
*/
var defaults={
/**
* （必填）选择器 和 jquery选择器用法相同 ，支持 #id / .class / div div:eq(2)等 【字符串】
*
*/
selector:"",
/**
* （必填）提示文字 【字符串】
*/
message:"输入非法，请重新输入",
/**
* （推荐使用）校验规则一组校验规则 【数组】
*/
checkType:[],
/**
* 显示方式 1,2,3,4 上右下左四个方向 【标识字符】
*/
showType:2,
/**
* 最大长度 默认为18 【数字类型】
*/
maxLength:18,
/**
* 最小长度 默认为0 【数字类型】
*/
minLength:0,
/**
* 是否允许为空 true or false 【bool类型】
*/
isEmpty:false,
/**
* 校验之前执行 的方法 【函数】
*/
checkBefore:null,
/**
* 校验之后执行 的方法 【函数】
*/
checkAfter:null,
/**
* 回调函数 ；在执行每个校验规则时执行 【函数】
*/
cheCallback:null,
/**
* 定义需要校验元素的样式 ，在初始化时处理元素样式 【键值对象】
*/
checkCss:{},
};
/**
* 定义校验规则
*/
var _cheType={
/**
* 私有处理方法
*/
__regexVal:function(regex,val,callback){
var flg=regex.test(val);
if(typeof callback=="function"){
flg= callback(val,flg);
}
return flg;
},
/**
* 不为空
* @param val 值
* @param callback 回调函数
*/
notNull:function(val,callback){
val=val.replace(/^\s/g,"").replace(/\s￥/g,"");
var flg=val.length>0;
if(typeof callback=="function"){
callback(val,flg);
}
},
/**
* 小数类型(1位小数) 0.1~999999999999999999.9
* @param callback 回调函数
*/
isDouble1:function(val,callback){
regex=/^[0-9]{1,18}[.]?[0-9]{0,1}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 小数类型(2位小数) 0.01~999999999999999999.99
*/
isDouble2:function(val,callback){
regex=/^[0-9]{1,18}[.]?[0-9]{0,2}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 小数类型(3位小数) 0.001~999999999999999999.999
*/
isDouble3:function(val,callback){
regex=/^[0-9]{1,18}[.]?[0-9]{0,3}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 小数类型(4位小数) 0.0001~999999999999999999.9999
*/
isDouble4:function(val,callback){
regex=/^[0-9]{1,18}[.]?[0-9]{0,4}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 小数类型(5位小数) 0.00001~999999999999999999.99999
*/
isDouble5:function(val,callback){
regex=/^[0-9]{1,18}[.]?[0-9]{0,5}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 小数类型(6位小数) 0.000001~999999999999999999.999999
*/
isDouble6:function(val,callback){
regex=/^[0-9]{1,18}[.]?[0-9]{0,6}$/;
return this.__regexVal(regex,val,callback);
},
/**
*整数 1-18位
*/
isInteger:function(val,callback){
regex=/^[0-9]{1,18}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 大小写 1-18位
*/
isLetter:function(val,callback){
regex=/^[a-zA-Z]{1,18}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 大写 1-18位
*/
isUpperLetter:function(val,callback){
regex=/^[A-Z]{1,18}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 小写 1-18位
*/
isLowerLetter:function(val,callback){
regex=/^[a-z]{1,18}$/;
return this.__regexVal(regex,val,callback);
},
/**
* 手机号
* 联通现有号段是：130、131、132、155、156、186、185，其中3G专属号段是：186、185。还有无线上网卡专属号段：145。
移动现有号段是：134、135、136、137、138、139、150、151、152、157、158、159、182、183、188、187。
电信现有号段是：133、153、180、181、189。
*/
isPhone: function (val,callback) {
//130','131','132','133','134','135','136','137','138','139','145','150','151','152','153','155','156','157','158','159','180','181','182','183','185','186','187','188','189','170,6,7,8','1907'
regex = /^((1[3,5,8][0-9])|(14[5,7])|(17[0,6,7,8])|(19[7]))\d{8}$/;
regex1 = /^0(([1,2]\d)|([3-9]\d{2}))\d{7,8}$/;
return this.__regexVal(regex,val,callback) ||this.__regexVal(regex1,val,callback);
},
/**
* 邮件
*/
isEmail: function (val,callback) {
regex = /\w+[@]\w+(\.\w+){1,2}/;
return this.__regexVal(regex,val,callback);
},
/**
* 中文字符
*/
isChinese: function (val,callback) {
regex = /^[\u4e00-\u9fa5]+$/;
return this.__regexVal(regex,val,callback);
},
/**
*除特殊符号外的任意字符
*/
isAnyChar:function(val,callback){
regex = /[\?\!\@\#\$\%\^\&\*\(\)\_\+\{\}\:\"\|\>\?\<-\=\[\]\;\'\\\/\.\,\`\~\！\@\#\￥\%\…\…\&\*\（\）\—\—\+\{\}\：\“\|\《\》\？\；\‘\、\，\。\、\【\】]/;
return !this.__regexVal(regex,val,callback);
},
/**
*除特殊符号外的任意字符
*/
isText:function(val,callback){
regex = /[\\]/;
return !this.__regexVal(regex,val,callback);
}
};
//缓存错误信息的html字符
var errorMsgHtml={}
/**
* 扩展jQuery对象本身,定义错误成功提示信息
* 可从外部重写
*/
$.extend({
/**
* 成功处理方法
*/
"_cheSuccess": function (obj,showType,flg,val,msg) {
var _select=$(obj)["selector"].replace(/'/g,"\'").replace(/"/g,"\'");
_select=_select==""?"[name='"+$(obj).attr("name")+"']":_select;
var tip=errorMsgHtml[_select];
if(tip!=null){
layer.close(tip)
}
$(obj)[0].style["border"]="1px solid #ccc";
$(obj)[0].style["backgroundColor"]="white";
return flg;
},
/**
* 错误处理方法
*/
"_cheError": function (obj,showType,flg,val,msg) {
//使用layui的 tips
var _select=$(obj)["selector"].replace(/'/g,"\'").replace(/"/g,"\'");
_select=_select==""?"[name='"+$(obj).attr("name")+"']":_select;
var tip=errorMsgHtml[_select];
if(tip!=null){
layer.close(tip)
}
var tip=layer.tips(msg,$(obj)["selector"], {time:0,tips: [showType,'#ff9800'],tipsMore: true });
errorMsgHtml[_select]=tip;
$(obj)[0].style["border"]="1px solid #ff9800";
$(obj)[0].style["backgroundColor"]="#f8f2e3";
return flg;
},
/**
* 初始化加载js,css文件
*@param 形如 fileArray [{path:"./style.css",type:'css'}]
*/
"_initExtendFile":function(fileArray){
var optFile=[
{path:"/Member/resources/css/jquery.checkstyle.css",type:'css'},
{path:"/Member/resources/js/checkInput/layui.all.js",type:'js'},
];
if(fileArray!=undefined&&fileArray!=null){
optFile=$.extend({},optFile,fileArray);
}
$.each(optFile,function(index,item){
var type=item["type"];
if(type=="js"){
$.getScript(item["path"]);
}else{
$('head').append('<link rel="stylesheet" type="text/css" href="'+item["path"]+'">');
}
});
},
/**
* 定义得到函数值得方法
* @param {要获取数据的jQuery对象，非DOM对象} $obj
*/
"_getVal":function($obj){
var type=$obj.prop("tagName")||$obj.type;
type=type.toLocaleLowerCase();
(type=="input")&&(type=$obj.attr("type"));
var val;
switch (type) {
case "radio":
var name=$obj.attr("name");
val=$("[name='"+name+"']:checked").val();
break;
case "checkbox":
val=[];
var name=$obj.attr("name");
var nameDom=$("[name='"+name+"']");
for(var i=0;i<nameDom.length;i++){
if(!nameDom[i].checked){continue;}
val.push(nameDom[i].value);
}
break;
default:
val=$obj.val();
break;
}
(typeof val=="string")&&(val=val.replace(/^\s/g,"").replace(/\s$/g,""));
(val==undefined)&&(val="");
return [val,type];
}
});
})(window.jQuery);
详细用法
一。用前准备
1.保存上文的CSS内容，文件名为：jquery.checkstyle.css
2.下载layer.all.js文件文件名为：layui.all.js
3.保存插件的JS代码，文件名为：jquery.checkinput.js
4.下载的jquery.js文件，文件名为：jquery.1.10.1.min.js
二。开始使用
1.新建一个的的test.html文件
2.将以上文件拷贝到同一个目录
3.在HTML文件中引入jQuery的文件和jquery.checkinput.js
<script type="text/javaScript" src="jQuery.1.10.1.min.js"></script>
<script type="text/javaScript" src="jQuery.checkinput.js"></script>这样插件就已经引入进来了，样式文件在插件中已经默认引入。在这之后，你也可以在外部重新定义默认引入文件，如下
$._initExtendFile([
{path:"jquery.checkstyle.css",type:'css'},
{path:"layui.all.js",type:'js'}
])3.输入框输入类型='文本'输入类型='密码'判断
一，创建在test.html中的页面中创建输入文本框
<input type="text" id="name" ><br/>二，初始化需要验证的信息
var check=[
{
selector:"#name", //插件验证的选择器，和jquery用法一致
checkType:["isInteger"], //配置验证规则
message:"(必填)名称数字", //配置验证不通过的提示信息
//以下可选
maxLength:10, //输入最大长度，默认为18
minLength:5, //输入最小长度，默认为5
isEmpty:false, //是否为空，默认为false
//在进行校验数据之前执行的回调函数
checkBefore:function(obj,opt,flg){
console.log("这是调用之前执行的方法");
console.log(obj,opt,flg);
},
//在进行校验数据之后执行的回调函数
checkAfter:function(obj,opt,flg){
console.log("这是调用之后执行的方法");
console.log(obj,opt,flg);
},
//在数据校验完成之后执行的回调函数
cheCallback:function(obj,opt,flg){
console.log("验证时：这是在验证时调用的回调函数方法");
console.log(obj,opt,flg);
return flg;
}
}
];
//这里的this最好选择小的范围，比如当前的form $("[name='form']")._initCheck()
$(this)._initCheck();
通常情况下我们只需要配置前面三个属性即可如下
var check=[ {
selector:"#name",
checkType:["isInteger"],
message:"(必填)名称只能为数字"
}]当前的检查为一个数组，数组内可存放多个需要校验的数据
比如，在test.html中的页面中假如密码框
<input type="password" id="password" ><br/>验证名称和密码只需要如下配置即可
var check=[
{
selector:"#name",
checkType:["isInteger"],
message:"(必填)名称只能为数字"
},
{
selector:"#password",
isEmpty:false,
checkType:["isAnyChar"],
message:"除特殊符号外的任意字符",
}
]角配置完成之后调用$（“[名称='形式']”）._ initCheck（）方法进行验证
4.选择框，下拉框，单选框，多选框，配置如上。
注：单选框，多选框，必须具备name属性且选择器只能为“ [name ='名称'] ”的形式
5.错误成功提示修改，只需重新$ ._ cheSuccess（OBJ，showType，FLG，缬氨酸，MSG）和$ ._ cheError（OBJ，showType，FLG，缬氨酸，MSG）方法即可
方法参数解释
obj： 当前验证元素的jquery对象
showType: 显示方式，约定为layer中tips的四个值 1,2,3,4 上右下左四个方向
val: 当前验证元素的值，这个值已近做过处理，分别去掉了两侧空格，将多选框的值将返回一个数组，其他返回为字符串
msg: 返回的错误提示信息例如，重新定义错误提示为弹框
$._cheError=function(obj,showType,val,msg){
alert(msg);
}6.校验参数详解，具体可以参考jquery.checkinput.js文件，具备详细的注释
/**
* 校验参数设置
*/
var defaults={
/**
* （必填）选择器 和 jquery选择器用法相同 ，支持 #id / .class / div div:eq(2)等 【字符串】
*
*/
selector:"",
/**
* （必填）提示文字 【字符串】
*/
message:"输入非法，请重新输入",
/**
* （推荐使用）校验规则一组校验规则 【数组】
*/
checkType:[],
/**
* 显示方式 1,2,3,4 上右下左四个方向 【标识字符】
*/
showType:2,
/**
* 最大长度 默认为18 【数字类型】
*/
maxLength:18,
/**
* 最小长度 默认为0 【数字类型】
*/
minLength:0,
/**
* 是否允许为空 true or false 【bool类型】
*/
isEmpty:false,
/**
* 校验之前执行 的方法 【函数】
*/
checkBefore:null,
/**
* 校验之后执行 的方法 【函数】
*/
checkAfter:null,
/**
* 回调函数 ；在执行每个校验规则时执行 【函数】
*/
cheCallback:null,
/**
* 定义需要校验元素的样式 ，在初始化时处理元素样式 【键值对象】
*/
checkCss:{},
};7.保存校验$（“[name ='form']”）._ saveChe（）;
var flg=$("[name='form']")._saveChe();
alert(flg?"验证通过","验证不通过");此方法会返回一个布尔类型的变量，只需要判断此变量即可。
8._initCheck参数方法介绍，详情可参考jquery.checkinput.js文件
/**
* 根据定义的校验信息进行校验信息
* @param optionArrays: 需要验证的参数配置，详情参考下文defaults对象， 形如
[{
selector:"#name",
isEmpty:false,
checkType:["notNull","isChinese"],
message:"(必填)请输入用户名称，名称只能为汉字"
checkBefore:function(obj,opt,flg){
console.log("这是调用之前执行的方法");
alert("这是调用之前执行的方法");
console.log(obj,opt,flg);
},
checkAfter:function(obj,opt,flg){
console.log("这是调用之后执行的方法");
console.log(obj,opt,flg);
alert("这是调用之后执行的方法");
},
cheCallback:function(obj,opt,flg){
console.log("这是回调函数的方法");
console.log(obj,opt,flg);
alert("这是回调函数的方法");
}
},
{....},
....
]
* @param resultsFn: 验证操作完成时执行的回调函数。回调函数返回参数： (验证元素,验证参数,验证结果)
* @param initFileArray: 初始化文件的数组配置 形如：[{path:"./style.css",type:'css'},{path:"https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js",type:'js'}]
*/
function _initCheck(optionArrays,resultsFn,initFileArray)
有兴趣的朋友可以借鉴，如果转载请指明出处。
如果使用插件，请注明原创者
如果修改插件，请发布修改后的版本，让此插件更加完善，生态。
1327
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
