jQuery Password Validation密码验证


Posted in Javascript onDecember 30, 2016

jQuery Password Validation(密码验证)插件扩展了 jQuery Validate 插件,提供了两种组件:
一种评价密码的相关因素的功能:比如大小写字母的混合情况、字符(数字、特殊字符)的混合情况、长度、与用户名的相似度(可选的)。
一种使用评价功能显示密码强度的验证插件自定义方法。显示的文本可以被本地化。
您可以简单地自定义强度显示的外观、本地化消息显示,并集成到已有的表单中。
该插件目前版本是 1.0.0。

使用方式
如需使用 Password Validation(密码验证)插件,请添加一个 class "password" 到 input,同时添加显示强度的基本标记在表单的需要显示的地方:

<form id="register">
 <label for="password">Password:</label>
 <input class="password" name="password" id="password" />
 <div class="password-meter">
 <div class="password-meter-message"> </div>
 <div class="password-meter-bg">
  <div class="password-meter-bar"></div>
 </div>
 </div>
</form>

对表单应用 Validate 插件:

$(document).ready(function() {
 $("#register").validate();
});

您可以重载 $.validator.passwordRating 实现不同的评价方法。或者重载 $.validator.passwordRating.messages 来提供其他消息,比如本地化。

实例演示

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Makes "field" required to be the same as #other</title>
<link rel="stylesheet" href="http://jqueryvalidation.org/files/demo/site-demos.css">
 
</head>
<body>
<form id="myform">
<label for="password">Password</label>
<input id="password" name="password" />
<br/>
<label for="password_again">Again</label>
<input class="left" id="password_again" name="password_again" />
<br>
<input type="submit" value="Validate!">
</form>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
<script>
// just for the demos, avoids form submit
jQuery.validator.setDefaults({
 debug: true,
 success: "valid"
});
$( "#myform" ).validate({
 rules: {
  password: "required",
  password_again: {
   equalTo: "#password"
  }
 }
});
</script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript获取GridView中用户点击控件的行号,列号
Apr 14 Javascript
给Flash加一个超链接(推荐使用透明层)兼容主流浏览器
Jun 09 Javascript
JavaScript设计模式之外观模式介绍
Dec 28 Javascript
JQuery插件ajaxfileupload.js异步上传文件实例
May 19 Javascript
通过原生JS实现为元素添加事件的方法
Nov 23 Javascript
使用D3.js制作图表详解
Aug 13 Javascript
Vue2.0父子组件传递函数的教程详解
Oct 16 Javascript
Vue 中使用 CSS Modules优雅方法
Apr 09 Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
Aug 23 Javascript
vue中input的v-model清空操作
Sep 06 Javascript
Vue插件之滑动验证码
Sep 21 Javascript
如何在 Vue 表单中处理图片
Jan 26 Vue.js
JS编写函数实现对身份证号码最后一位的验证功能
Dec 29 #Javascript
EasyUI学习之Combobox下拉列表(1)
Dec 29 #Javascript
JSON中key动态设置及JSON.parse和JSON.stringify()的区别
Dec 29 #Javascript
jQuery+HTML5实现弹出创意搜索框层
Dec 29 #Javascript
Bootstrap3 内联单选和多选框
Dec 29 #Javascript
Bootstrap3 多选和单选框(checkbox)
Dec 29 #Javascript
EasyUI学习之DataGird分页显示数据
Dec 29 #Javascript
You might like
php连接Access数据库错误及解决方法
2013/06/20 PHP
php curl登陆qq后获取用户信息时证书错误
2015/02/03 PHP
php获取json数据所有的节点路径
2015/05/17 PHP
php中preg_match的isU代表什么意思
2015/10/01 PHP
Yii框架多语言站点配置方法分析【中文/英文切换站点】
2020/04/07 PHP
JavaScript创建命名空间(namespace)的最简实现
2007/12/11 Javascript
jquery 简单导航实现代码
2009/09/11 Javascript
下拉列表select 由左边框移动到右边示例
2013/12/04 Javascript
jQuery中:file选择器用法实例
2015/01/04 Javascript
javascript实现网页屏蔽Backspace事件,输入框不屏蔽
2015/07/21 Javascript
jQuery代码实现对话框右上角菜单带关闭×
2016/05/03 Javascript
jQuery可见性过滤选择器用法示例
2016/09/09 Javascript
js放到head中失效的原因与解决方法
2017/03/07 Javascript
浅析vue深复制
2018/01/29 Javascript
vue通过style或者class改变样式的实例代码
2018/10/30 Javascript
webpack 从指定入口文件中提取公共文件的方法
2018/11/13 Javascript
使用原生js编写一个简单的框选功能方法
2019/05/13 Javascript
基于layui内置模块(element常用元素的操作)
2019/09/20 Javascript
Vue用mixin合并重复代码的实现
2020/11/27 Vue.js
[15:39]教你分分钟做大人:龙骑士
2014/10/30 DOTA
[00:26]TI7不朽珍藏III——冥界亚龙不朽展示
2017/07/15 DOTA
Python3实战之爬虫抓取网易云音乐的热门评论
2017/10/09 Python
Python简单计算文件MD5值的方法示例
2018/04/11 Python
Python学习笔记之视频人脸检测识别实例教程
2019/03/06 Python
Python中如何导入类示例详解
2019/04/17 Python
Python 中的 global 标识对变量作用域的影响
2019/08/12 Python
pytorch ImageFolder的覆写实例
2020/02/20 Python
Django-xadmin后台导入json数据及后台显示信息图标和主题更改方式
2020/03/11 Python
Foot Locker意大利官网:全球领先的运动鞋和服装零售商
2017/05/30 全球购物
美国专业消费电子及摄影器材网站:B&H Photo Video
2019/12/18 全球购物
实习护理工作自我评价
2013/09/25 职场文书
护理专业毕业生自我鉴定总结
2014/03/24 职场文书
小学教育见习总结
2015/06/23 职场文书
情人节单身感言
2015/08/03 职场文书
PHP判断是否是json字符串
2021/04/01 PHP
python tkinter模块的简单使用
2021/04/07 Python