如何使用jQuery表单验证插件Validator

大家好，今天小编来为大家解答如何使用jQuery表单验证插件Validator这个问题，很多人还不知道，现在让我们一起来看看吧！

script src=’//cdn.bootcss.com/jquery/3.4.1/jquery.js’/scriptscript src=’js/jquery.validate.js’/script 让我演示一下我现在正在编写的项目。它使用引导框架。

$(function() { jQuery.validator.addMethod(‘regUserName’, function(value, element) { return this.可选(element) || /^[0-9]*[a-zA-Z_\u4e00-\ u9fa5]+[0-9]*$/.test(value); }, ‘注册昵称应为4-10位数字、下划线、中英文字母，但不能全部是数字’);jQuery.validator.addMethod( ‘isMobile’, function(value, element) { var length=value.length; var mobile=/^(($\d{2,3}$)|(\d{3}\-))?1 [3,8,5]{1}\d{9}$/; return this.optional(element) || (length==11 mobile.test(value)); ‘请填写您的手机号码正确’); //登录账户合法性验证jQuery.validator.addMethod(‘logAccountCheck’, function (value, element) { var length=value.length; var mobile=/^(($\d{2,3} $)|(\d{3}\-))?1[3,8,5]{1}\d{9}$/; 返回this.可选(元素) || (长度==11 移动。 test(value)) || /^[\u0391-\uFFE5\w]+$/.test(value); }, ‘昵称不符合登录规则’);$(‘#fillForm’). validate({ errorElement: ‘span’, errorClass: ‘help-block’, focusInvalid: false, Rules: { new_userName: { required: true, regUserName: true, minlength: 4, maxlength: 10 }, new_userPwd: { required: true, [5, 15] }, new_userPwd_twice: { required: true, equalTo: ‘#new_userPwd’ }, new_userEmail: { required: true, email: true }, new_userPhone: { required: true, isMobile:true,digits: true, minlength: 11, maxlength: 11 }, th: { required: true }，new_userCollege: { required: true }，new_userMajor: { required: true } } , messages: { new_userName: { required: ‘昵称不能为空’, minlength: ‘昵称至少为4个字符’, maxlength: ‘昵称最多为10个字符’ }, new_userPwd: { required: ‘密码不能为空beempty’, rangelength: $.validator.format(‘密码长度必须在{0}到{1}之间’) }, new_userPwd_twice: { required: ‘该项不能为空’, equalTo: ‘两次输入的密码必须一致’ }, new_userEmail: { required: ‘邮箱不能为空’, email: ‘邮箱格式不正确（如： xxx@xx.com）’ }, new_userPhone: { required: ‘电话号码不能为空’,digits: ‘电话号码必须是数字’, minlength: ‘电话号码为11位’, maxlength: ‘电话号码号码为11位’ }, new_userBirth: { required: ‘生日不能为空’ }, new_userCollege: { required: ‘院校不能为空’ }, new_userMajor: { required: ‘专业不能为空’ } },highlight: function (element) { $(element ).closest(‘.form-group’).addClass(‘has-error’); }, success: 函数（标签）{ label.closest(‘.form-group’).removeClass(‘has-error’). addClass(‘已成功’);标签.remove(); }, errorPlacement: 函数（错误，元素）{ element.parent(‘div’).after(error); }, SubmitHandler: 函数（表单）{ var result={ ‘new_userName’: $(‘#new_userName’).val(), ‘new_userPwd’: $(‘#new_userPwd’).val(), ‘new_userEmail’: $( ‘#new_userEmail’).val(), ‘new_userPhone’: $(‘#new_userPhone’).val(), ‘new_userBirth’: $(‘#new_userBirth’).val(), ‘new_userGender’: $(‘input [name=’new_userGender’]:checked’)。 val(), ‘new_userCollege’: $(‘#new_userCollege’).val() + ‘,’ + $(‘#new_userMajor’).val() };结果.new_userIP=ip; var res=JSON.stringify( 结果);警报（RES）；返回假； } })}) html文件和平常一样，主要是在js中验证：