/**
* 主要用于用户表单校验逻辑 显示on 2017/12/9.
*/
$(function(){
// 手机号码验证
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
return this.optional(element) || (length == 11 && mobile.test(value));
}, "请正确填写您的手机号码");
// 邮箱验证规则
jQuery.validator.addMethod("isEmail", function(value, element) {
var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/;
return this.optional(element) || (reg.test(value));
}, "请正确填写您的邮箱");
// 下拉框的验证
jQuery.validator.addMethod("isSelect", function(value, element) {
return this.optional(element)|| (value!=-1);
}, "请选择");
});
//校验用户表单逻辑
function checkUserForm(id,operate){
validator = $("#editUserForm").validate({
// onfocusout: false, //失去焦点
onkeyup: false, // 键盘是否按下
//onclick: false, //是否单击
rules: {
userName: {
required: true,
//异步验证 开始
remote: {
url: ctx + "/sys/manager/authc_json/checkRepeatUserName.shtml",//发送请求的url地址
type: "post", //请求方式
async:false,
dataType: "json",//接收的数据类型
cache:false,
data: {
userName: function () {
return $("#editUserForm #userName").val();
},
userID:id?id:0,
operate:operate
},
dataFilter: function (data, type) { //过滤返回结果
if(data == "true"){
return true; //true代表用户名称还未存在
}else{
return false; //false代表用户名称已经存在
}
}
}
//异步验证 结束
},
roleID:{
required:true,
isSelect:true
},
realname:{
required: true
},
phone:{
required:true,
isMobile:true
},
email:{
isEmail:true
}
},
messages: {
userName: {
required: "请填写您的账号",
remote:"录入的账号名称重复,请重新输入"
},
realname:{
required: "请填写您的真实姓名"
},
roleID:{
required:"请选择关联角色",
isSelect:"请选择关联角色"
},
phone:{
required:"请填写您的手机号码",
isMobile:'手机号码格式不正确'
},
email:{
isEmail:'邮箱格式不正确'
}
}
});
}
/**
* 扩展插件 错误提示用layer 显示on 2017/12/9.
*/
(function ($) {
"use strict";
$.fn.extend($.validator.defaults, {
//重写showErrors
showErrors: function (errorMap, errorList) {
$.each(errorList, function (i, v) {
//在此处用了layer的方法,显示效果更美观
if($(v.element)[0].tagName.indexOf("SELECT")>-1){ // 针对于select2 控件做了调整
layer.tips(v.message, $(v.element).next(), {icon: 2 , time: 2000 });
}else{
layer.tips(v.message, v.element, {icon: 2 , time: 2000 });
}
return false;
});
}
});
})(jQuery);-------------大家可以尝试下