主要API如下：
验证str中是否含有seed
验证是否相等
验证str是否是一个指定date之后的时间字符串，默认date为现在，与之相反的是isBefore方法
检查是否是布尔值
检查是否是信用卡
检查str是否是一个可以被number整除的数字
检查是否是邮件地址
检查字符串是否为空
是否是域名
是否是浮点数
是否是哈希值
是否是十六进制颜色值，例如#ffffff
是否是十六进制数字
是否是IP地址值，version为4或者6
是否是ISBN号，version为10或者13
是否是整数
使用JSON.parse判断是否是json
判断字符串的长度是否在一个范围内，options默认为{min:0, max: undefined}
是否小写
是否是MAC地址
是否是MD5加密的哈希值
是否是MIME type值
是否是MongoDB的id值
是否仅仅包含数字
是否是一个端口号
是否是一个URL地址
是否大写
是否匹配，利用match方法，其中匹配的模式可以作为第三个参数，当然也可以卸载正则表达式pattern中
移除黑名单中的字符
对< > & ' " /进行HTML转义，与之相反的方法是unescape
对字符进行左缩进，与之对应的右缩进为rtrim方法，两端缩进trim
此外还有toBoolean、toDate、toFloat、toInt、whitelist
validator.js remote 返回类型是根据表单比较的结果一般是返回字符串类型。
有时候不仅仅对表单所录入的信息进行验证还需要将录入的值与数据库进行比较，这时就需要借助remote方法来实现。以下介绍 jquery.validate.js的后台验证的remote方法，准备工作，前台页面：
<script src="test/jquery.js" type="text/javascript"></script>
<script src="test/jquery.validate.js" type="text/javascript"></script>
<script src="test/jquery.validate.message_cn.js" type="text/javascript"></script>
</head>
<body>
<form name="test" id="testform" method="get" action="get.php">
<fieldset>
<legend title="用户注册(User Register)">用户注册(User Login)</legend>
<p>
<label for="name">用户名：</label>
<input id="name" name="name" type="text" />
</p>
<p>
<label for="mail">邮箱:</label>
<input id="mail" name="mail" type="password" />
</p>
<p>
<label for="password">密码：</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="repassword">重复密码：</label>
<input id="repassword" name="repassword" type="password" />
</p>
<p>
<label for="hash">邀请码：</label>
<input id="hash" name="hash" type="text" />
</p>
<p>
<label for="sel">选择：</label>
<select id="sel" name="sel">
<option value="">请选择</option>
<option value="1">选择1</option>
<option value="2">选择2</option>
<option value="3">选择3</option>
<option value="4">选择4</option>
</select>
</p>
<p>
<label for="type">用户类型：</label>
<span><input name="type" type="radio" value="1" />类型1</span>
<span><input name="type" type="radio" value="2" />类型2</span>
<span><input name="type" type="radio" value="3" />类型3</span>
</p>
<p>
<label for="submit"> </label>
<input class="submit" type="submit" value="注册"/>
</p>
</fieldset>
</form>
要实现的效果：
验证代码：
<script type="text/javascript">
$(function(){
$("#testform").validate({
rules : {
name : {
required : true
},
password: {
required: true,
minlength: 5
},
repassword: {
required: true,
minlength: 5,
equalTo: "#password"
},
hash: {
required: true,
remote: 'checkhash.php'
},
sel: {
remote: 'checksel.php'
},
type: {
remote:{
url: "changeusertype.php",
type: "get",
dataType: 'json',
data: {
'type': function(){return $('input[name="type"]:checked').val()}
}
}
}
},
messages : {
name : {
required : '必填'
},
password: {
required: '必填',
minlength: '最少5个字符'
},
repassword: {
required: '必填',
minlength: '最少5个字符',
equalTo: '两次输入的密码不一样'
},
hash: {
required: '必填',
remote: '邀请码不正确'
},
sel: {
remote: '选择不正确'
},
type: {
remote: '类型不可更改'
}
},
focusInvalid: true,
/*指定错误信息位置*/
errorPlacement: function (error, element) {
error.appendTo(element.closest("p"))
},
//设置错误信息存放标签
errorElement: "em",
submitHandler: function(form) {
}
})
})
</script>
验证结果如下：
做项目时前台表单验证用了jquery.validation插件。
发现在做正则表达式验证时没有参数设置可以使用，需要一个个添加方法，比较麻烦。
就做了一个简单的分装，也总结了一些正则表达式。
/**
* @anthor ycf
* @date 1017/11/3
*
* 本js是对jquery.validator的自定义方法的封装
* 只能用于正则表达验证
* 页面必须调用jquery.validator.js
* 共两个方法
* regular 只添加一个正则自定义函数
* regulararr 批量导入，传入对象即可。
* 具体信息请看页面展示及函数参数说明
* 以下是一些常用的正则表达式。
*/
//用户名验证
var usernameExp = /^[a-zA-Z0-9_-]{4,16}$/
//姓名验证
var nameExp = /^[\u4E00-\u9FA5A-Za-z]+$/
//密码验证
var pwdExp = /^[0-9a-zA-Z_#!@$%^&*]{6,16}$/
//年龄验证
var ageExp = /^(?:0|[1-9][0-9]?|120)$/
//邮箱验证
var emailExp = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/
//固定电话验证
var telExp = /^0\d{2,3}-\d{7,8}(-\d{1,6})?$/
//手机号码验证
var phoneExp = /^0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8}$/
//英文名验证
var enameExp = /^[a-zA-Z]+$/
//邮政编码验证
var postalcodeExp = /^[0-9][0-9]{5}$/
//QQ验证
var qqExp = /^\d{5,10}$/
//非法字符验证
var ffzfExp = /[@#\$%\^&\*]+/g
//IP验证
var ipExp = /((25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))/
//非负整数验证
var ffzsExp = /^(0|[1-9]\d*)$/
//正负小数验证
var zfxsExp = /^[+-]?\d*\.\d{1,3}$/
//正负整数和小数验证
var zfzshxsExp = /^(-)?\d+(\.\d+)?$/
//身份证号验证
var idcardExp = /^[1-9][0-9]{5}(19[0-9]{2}|200[0-9]|201[0-9]|202[0-9]|203[0-9])(0[1-9]|1[0-2])(0[1-9]|[12][0-9]|3[01])[0-9]{3}[0-9xX]$/i
//限制输入
var limitExp = /^((?!test).)*$///不能输入包含test的字符串
/**
* 自定义正则匹配方法
* @param funName 自定义方法名
* @param Exp 正则表达式
* @anthor ycf
*/
function regular(funName,Exp){
jQuery.validator.addMethod(funName, function(value, element) {
return this.optional(element) || Exp.test(value)
}, "不通过")
}
/**
* 批量添加自定义正则匹配方法
* @param objExp 对象
* 例如{ "postalcodeCheck":postalcodeExp}
*
* @anthor ycf
*/
function regularArr(objExp){
$.each(objExp, function(i) {
jQuery.validator.addMethod(i, function(value, element) {
return this.optional(element) || objExp[i].test(value)
}, "不通过")
})
}
这样在前台js里只需要申明一个对象，并引入这个js文件就行了。希望能帮到大家。
