关于Jquery的Validate插件--rules添加自定义方法(强密码验证方法)

简介:请看菜鸟教程,根据给出的方法,自定义识别密码是否为复杂密码的方法

链接: https://www.runoob.com/jquery/jquery-plugin-validate.html

Query Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求。该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证,同时提供了一个用来编写用户自定义方法的 API。所有的捆绑方法默认使用英语作为错误信息,且已翻译成其他 37 种语言。

该插件是由 Jörn Zaefferer 编写和维护的,他是 jQuery 团队的一名成员,是 jQuery UI 团队的主要开发人员,是 QUnit 的维护人员。该插件在 2006 年 jQuery 早期的时候就已经开始出现,并一直更新至今。目前版本是 1.14.0。

访问 jQuery Validate 官网,下载最新版的 jQuery Validate 插件。

菜鸟教程提供的 1.14.0 版本下载地址:http://static.runoob.com/download/jquery-validation-1.14.0.zip

自定义方法

javascript 复制代码
<script type="text/javascript">
		//自定义pwdMatch方法
		$.validator.addMethod("pwdMatch",function(value,element,params){
		//强密码正则表达式-大小写字母、数字、符号三种类型组合的密码,长度至少为8位
			var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
			if(strongRegex.test(value)) {
				return true;
			}else {
				return false;
			}
		},"请使用大小写字母、数字、符号三种类型组合的密码,长度至少为8位。");
		$(document).ready(function() {
			$("#submitForm").validate({
				rules: {
					//这里添加方法使用规则,即应用上面自定义的密码规则方法
					newPassword:{pwdMatch:[]},
					confirmNewPassword:{pwdMatch:[]}
				},
				//提交的方法要在这重新写
				submitHandler: function(form){
					loading('正在提交,请稍等...');
					form.submit();
				},
				errorContainer: "#messageBox",
			});
		});
	</script>

原文如下

addMethod(name,method,message)方法

参数 name 是添加的方法的名字。

参数 method 是一个函数,接收三个参数 (value,element,param) 。

value 是元素的值,element 是元素本身,param 是参数。

我们可以用 addMethod 来添加除内置的 Validation 方法之外的验证方法。比如有一个字段,只能输一个字母,范围是 a-f,写法如下:

复制代码
$.validator.addMethod("af",function(value,element,params){  
    if(value.length>1){
        return false;
    }
    if(value>=params[0] && value<=params[1]){
        return true;
    }else{
        return false;
    }
},"必须是一个字母,且a-f");
如果有个表单字段的 name="username",则在 rules 中写:
复制代码
username:{
   af:["a","f"]
}

addMethod 的第一个参数,是添加的验证方法的名字,这时是 af。

addMethod 的第三个参数,是自定义的错误提示,这里的提示为:"必须是一个字母,且a-f"。

addMethod 的第二个参数,是一个函数,这个比较重要,决定了用这个验证方法时的写法。

如果只有一个参数,直接写,比如 af:"a",那么 a 就是这个唯一的参数,如果多个参数,则写在 [] 里,用逗号分开。

相关推荐
码事漫谈11 分钟前
解决 Anki 启动器下载错误的完整指南
前端
im_AMBER31 分钟前
Web 开发 27
前端·javascript·笔记·后端·学习·web
蓝胖子的多啦A梦1 小时前
低版本Chrome导致弹框无法滚动的解决方案
前端·css·html·chrome浏览器·版本不同造成问题·弹框页面无法滚动
玩代码1 小时前
vue项目安装chromedriver超时解决办法
前端·javascript·vue.js
訾博ZiBo1 小时前
React 状态管理中的循环更新陷阱与解决方案
前端
StarPrayers.1 小时前
旅行商问题(TSP)(2)(heuristics.py)(TSP 的两种贪心启发式算法实现)
前端·人工智能·python·算法·pycharm·启发式算法
一壶浊酒..2 小时前
ajax局部更新
前端·ajax·okhttp
苏打水com2 小时前
JavaScript 面试题标准答案模板(对应前文核心考点)
javascript·面试
Wx-bishekaifayuan2 小时前
基于微信小程序的社区图书共享平台设计与实现 计算机毕业设计源码44991
javascript·vue.js·windows·mysql·pycharm·tomcat·php
DoraBigHead3 小时前
React 架构重生记:从递归地狱到时间切片
前端·javascript·react.js