jQuery.validator.addMethod("mobile", function(value, element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/
return this.optional(element) || (length == 11 && mobile.test(value));
}, "手机号码格式错误");
// 电话号码验证
jQuery.validator.addMethod("phone", function(value, element) {
var tel = /^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$/;
return this.optional(element) || (tel.test(value));
}, "电话号码格式错误");
// 邮政编码验证
jQuery.validator.addMethod("zipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "邮政编码格式错误");
// QQ号码验证
jQuery.validator.addMethod("qq", function(value, element) {
var tel = /^[1-9]\d{4,9}$/;
return this.optional(element) || (tel.test(value));
}, "qq号码格式错误");
// IP地址验证
jQuery.validator.addMethod("ip", function(value, element) {
var ip = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
return this.optional(element) || (ip.test(value) && (RegExp.$1 < 256 && RegExp.$2 < 256 && RegExp.$3 < 256 && RegExp.$4 < 256));
}, "Ip地址格式错误");
// 字母和数字的验证
jQuery.validator.addMethod("chrnum", function(value, element) {
var chrnum = /^([a-zA-Z0-9]+)$/;
return this.optional(element) || (chrnum.test(value));
}, "只能输入数字和字母(字符A-Z, a-z, 0-9)");
// 中文的验证
jQuery.validator.addMethod("chinese", function(value, element) {
var chinese = /^[\u4e00-\u9fa5]+$/;
return this.optional(element) || (chinese.test(value));
}, "只能输入中文");
// 下拉框验证
$.validator.addMethod("selectNone", function(value, element) {
return value == "请选择";
}, "必须选择一项");
// 字节长度验证
jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {
var length = value.length;
for (var i = 0; i < value.length; i++) {
if (value.charCodeAt(i) > 127) {
length++;
}
}
return this.optional(element) || (length >= param[0] && length <= param[1]);
}, $.validator.format("请确保输入的值在{0}-{1}个字节之间(一个中文字算2个字节)"));
// 字符验证
jQuery.validator.addMethod("stringCheck", function(value, element) {
return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);
}, "只能包括中文字、英文字母、数字和下划线");
// 中文字两个字节
jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {
var length = value.length;
for(var i = 0; i < value.length; i++){
if(value.charCodeAt(i) > 127){
length++;
}
}
return this.optional(element) || ( length >= param[0] && length <= param[1] );
}, "请确保输入的值在3-15个字节之间(一个中文字算2个字节)");
// 身份证号码验证
jQuery.validator.addMethod("isIdCardNo", function(value, element) {
return this.optional(element) || isIdCardNo(value);
}, "请正确输入您的身份证号码");
// 手机号码验证
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
return this.optional(element) || (length == 11 && mobile.test(value));
}, "请正确填写您的手机号码");
// 电话号码验证
jQuery.validator.addMethod("isTel", function(value, element) {
var tel = /^\d{3,4}-?\d{7,9}$/; //电话号码格式010-12345678
return this.optional(element) || (tel.test(value));
}, "请正确填写您的电话号码");
// 联系电话(手机/电话皆可)验证
jQuery.validator.addMethod("isPhone", function(value,element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
var tel = /^\d{3,4}-?\d{7,9}$/;
return this.optional(element) || (tel.test(value) || mobile.test(value));
}, "请正确填写您的联系电话");
// 邮政编码验证
jQuery.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "请正确填写您的邮政编码");
initValidatorjs (异步验证用户名,手机号码,验证码,扩展验证)
/**
* @author Administrator
*/
function initValidator(base){
//异步验证用户名
jQuery.validator.addMethod("checkUserName", function(value, element){
var result = false;
// 设置同步
$.ajaxSetup({
async: false
});
var param = {
userName: value
};
$.post(base + "/checkUserName.do", param, function(data){
result = (1 == data);
});
// 恢复异步
$.ajaxSetup({
async: true
});
return result;
}, "用户名已经存在");
//异步验证手机号码
jQuery.validator.addMethod("checkSms", function(value, element){
var result = false;
// 设置同步
$.ajaxSetup({
async: false
});
var param = {
sms: value
};
$.post(base + "/checkSms.do", param, function(data){
result = (0 == data);
});
// 恢复异步
$.ajaxSetup({
async: true
});
return result;
}, "手机号码已经存在");
//异步验证验证码
jQuery.validator.addMethod("checkCode", function(value, element){
var result = false;
// 设置同步
$.ajaxSetup({
async: false
});
var param = {
userCode: value
};
$.post(base + "/checkCode.do", param, function(data){
result = (1 == data);
});
// 恢复异步
$.ajaxSetup({
async: true
});
return result;
}, "验证码不正确");
$("#thisFrom").validate({
//设置验证规则
rules: {
"userName": {
required: true,
userNameCheck: true,
checkUserName: true
},
"passWord": {
required: true,
rangelength: [6, 12]
},
"passWordAgain": {
required: true,
rangelength: [6, 12],
equalTo: "#passWord"
},
"corpName": {
required: true
},
"products": {
required: true
},
"name": {
required: true
},
"sms": {
required: true,
isMobile: true,
checkSms: true
},
"userCode": {
required: true,
checkCode:true
}
},
//设置错误信息
messages: {
"userName": {
required: "请输入用户名",
userNameCheck: "请输入4-20位字母开头的字母或数字和下划线",
checkUserName: "用户名已经存在"
},
"passWord": {
required: "请输入密码",
rangelength: "密码长度为6-12位"
},
"passWordAgain": {
required: "请再次输入密码",
rangelength: "密码长度为6-12位",
equalTo: "两次输入密码不相同"
},
"corpName": {
required: "请输入公司名称"
},
"name": {
required: "请输入联系人"
},
"products": {
required: "请输入主营产品"
},
"sms": {
required: "请输入手机号码",
isMobile: "请输入有效的手机号码",
checkSms: "手机号码已经存在"
},
"userCode": {
required: "请输入验证码",
checkCode:"验证码不正确"
}
},
errorPlacement: function(error, element){
error.appendTo(element.parent("td").next("td"));
}
});
}
相关推荐
4. 阻止默认行为:通过设置submitHandler回调,可以阻止表单的默认提交行为,实现异步验证或自定义提交逻辑。 四、API详解 1. .validate(options):主方法,用于初始化验证插件,options是包含各种配置项的对象。 ...
7. **异步验证**: `remote`规则可以用来进行服务器端验证,通过AJAX请求向服务器发送数据,返回'true'或'false'以判断输入是否有效。 8. **事件和回调函数**: 该库提供了如`invalidHandler`、`submitHandler`等...
- **异步验证**:支持使用`remote`规则进行服务器端验证。 - **分组验证**:`groups`选项可以将多个字段作为一个组进行验证。 - **禁用验证**:使用`.valid()`方法进行手动验证,或者通过`.valid()`的参数控制验证...
3. **自定义验证**:除了预设的验证规则,开发者还可以根据需求编写自己的验证方法,扩展验证功能。 4. **实时验证**:插件支持实时验证,用户在输入时即可看到错误反馈,无需等待提交表单后才知道问题所在。 5. *...
除了基本的验证功能,jQuery.validate还提供了许多高级特性,如远程验证(`remote`)和异步验证。例如,可以使用`remote`规则来检查用户名是否已被注册: ```javascript username: { required: true, remote: ...
本资源“jquery.validate+jquery.form.rar”是结合了两个重要的jQuery插件:jQuery Validate和jQuery Form,用于增强HTML表单的验证和异步提交功能。 jQuery Validate插件是用于客户端验证的工具,它允许开发者轻松...
### Jquery.validate表单验证详解 #### 一、引言 在Web开发中,表单验证是确保数据质量的关键步骤。...通过实践,可以进一步探索更多高级功能,如异步验证、动态规则调整等,从而满足更复杂的业务需求。
要在项目中使用 `jQuery.validate.js`,首先需要引入 jQuery 库,然后引入 validate 插件,如下所示: ```html <script src="../js/jquery.js" type="text/javascript"> <script src="../js/jquery.validate.js" ...
2. **jQuery Validate 插件**:`jquery.validate.js` 文件是这个插件的核心,它扩展了 jQuery 的功能,允许开发者添加自定义验证规则和错误消息,为表单字段创建验证逻辑。该插件默认包含了一些常见的验证方法,如...
jQuery.validate插件还提供了许多其他高级特性,如自定义验证方法、异步验证、分组验证等。例如,你可以创建一个自定义验证方法来检查用户名是否已被占用: ```javascript $.validator.addMethod("uniqueUsername",...
这个库提供了丰富的功能,能够轻松地实现各种验证规则,包括基本的非空检查、长度限制、邮箱格式验证,甚至复杂的自定义规则和Ajax异步验证。 在使用jQuery Validate时,首先需要在HTML文档中引入jQuery库和jQuery ...
《jQuery Validate 1.8.1:前端表单验证的利器》 在Web开发中,表单验证是一项不可或缺的功能,它能确保用户输入的数据符合预设的规则,从而提高用户体验并减少服务器端的压力。jQuery Validate插件是JavaScript库...
此外,它还支持异步验证,即通过Ajax进行后台数据验证,避免了表单重复提交的问题。 #### 二、示例代码解析 在给定的部分内容中,我们看到了一段具体的使用`jquery.validate.js`的代码实例。下面我们将对这段代码...
四、扩展验证规则 validate.js允许我们根据业务需求创建自定义验证规则。通过`.addMethod()`方法,我们可以添加新的验证函数。 ```javascript $.validator.addMethod("customRule", function(value, element) { /...
### jQuery Validate 快速入门与实战应用 #### 一、jQuery Validate 插件简介 `jQuery Validate` 是一个非常流行的前端表单验证插件,它基于 jQuery 开发,提供了丰富的验证规则和高度定制化的错误消息处理机制。...
总结来说,jQuery Validate是实现前端表单验证的高效解决方案,它具有丰富的验证规则、灵活的配置选项和强大的扩展能力。通过对它的深入理解和熟练运用,开发者可以创建出既美观又实用的表单,提升网站或应用的整体...
这些事件可以用来执行额外的操作,如显示/隐藏错误消息或处理异步验证。 6. **分组验证** 可以通过`groups`选项将多个字段组合成一组进行验证,确保所有字段都通过验证后才提交表单。 7. **远程验证** 对于需要...
3. **自定义验证方法**:通过`.addMethod()`,可以添加新的验证方法,扩展验证功能。 五、优化与注意事项 1. **错误消息定位**:使用`errorElement`和`errorClass`选项可以自定义错误消息的展示方式,例如改变错误...