参考:
http://www.cnblogs.com/hejunrex/archive/2011/11/17/2252193.html
http://www.cnblogs.com/si-shaohua/p/3780321.html
自定义规则:
$.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "请正确填写您的邮政编码");
$.validator.addMethod("username", function(value, element) {
var tel = /^[a-zA-Z]\w{5,19}$/;
return this.optional(element) || (tel.test(value));
}, "由数字、字母、下划线组成,不以数字开头,长度为6-20");
<form action="" class="rightForm emailForm active">
<input class="inputText" id="" name="email" type="text" placeholder="请输入常用邮箱" />
<input class="inputText" id="username" name="username" type="text" placeholder="用户名" />
<input class="inputText password" id="password" name="password" type="password" placeholder="设置密码" />
<input class="inputText" name="confirm_password" type="password" placeholder="确认密码" />
<div class="validate">
<input class="inputText" name="ZipCode" type="text" placeholder="验证码" />
<img src="img/index/validate.png"/>
<a class="blue" href="javascript:;">看不清?换一张</a>
</div>
<input class="submit" type="submit" value="注册"/>
<div class="recommend"><input class="ignore" type="checkbox" name=""/><span>填写推荐人用户名</span></div>
<div class="recommend accept"><input class="" type="checkbox"
checked="checked" name="accept"/><span>我已阅读并接受<a class="blue" href="javascript:;">《世纪开元服务协议》</a></span><a class="blue leftA" href="javascript:;">立即登录</a></div>
</form>
$(".rightForm").validate({
rules: {
email: { //input[name=email]
required: true,
email: true
},
username: { //input[name=username]
required: true,
username: true //自定义的验证规则
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: ".password" //与$(选择器) 相等
},
ZipCode: {
required: true
},
accept: {
required: true
}
},
messages: {
username: { //input[name=username]
required: "请输入用户名" //对应所需做的验证
/* username: ""*/ //为空,使用 默认提示
},
confirm_password: {
equalTo: "两次输入的密码不一致"
}
},
ignore: ".ignore", //忽略某些元素不验证,""里是jquery选择器
debug: true, //不提交数据, 只做测试
submitHandler: function submitHandler(form) {
//用其他方式替代默认的submit
/*alert("submitted");
form.submit();*/
print(132546);
var userID = $("#username").val();
var password = $("#password").val();
console.log(userID, password);
$.ajax({
type: "POST",
url: "http://datainfo.duapp.com/shopdata/userinfo.php?userID=" + userID + "&password=" + password + "&status=register",
success: function success(data) {
print(4564);
if (data == 0) {
alert("用户名重名,请重新输入");
} else if (data == 2) {
alert("系统异常,请稍后再试");
} else if (data == 1) {
print(123);
alert("注册成功");
}
},
error: function error() {}
});
}
});
messages_zh.js
$.extend($.validator.messages, {
required: "这是必填字段",
remote: "请修正此字段",
email: "请输入有效的电子邮件地址",
url: "请输入有效的网址",
date: "请输入有效的日期",
dateISO: "请输入有效的日期 (YYYY-MM-DD)",
number: "请输入有效的数字",
digits: "只能输入数字",
creditcard: "请输入有效的信用卡号码",
equalTo: "你的输入不相同",
extension: "请输入有效的后缀",
maxlength: $.validator.format("最多可以输入 {0} 个字符"),
minlength: $.validator.format("最少要输入 {0} 个字符"),
rangelength: $.validator.format("请输入长度在 {0} 到 {1} 之间的字符串"),
range: $.validator.format("请输入范围在 {0} 到 {1} 之间的数值"),
max: $.validator.format("请输入不大于 {0} 的数值"),
min: $.validator.format("请输入不小于 {0} 的数值")
});