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 相关文章推荐
使用JS操作页面表格,元素的一些技巧
Feb 02 Javascript
插件:检测javascript的内存泄漏
Mar 04 Javascript
JQuery 学习笔记 选择器之五
Jul 23 Javascript
细说javascript函数从函数的构成开始
Aug 29 Javascript
原生JavaScript生成GUID的实现示例
Sep 05 Javascript
javascript文件加载管理简单实现方法
Jul 25 Javascript
用NODE.JS中的流编写工具是要注意的事项
Mar 01 Javascript
javascript检查某个元素在数组中的索引值
Mar 30 Javascript
细数JavaScript 一个等号,两个等号,三个等号的区别
Oct 09 Javascript
基于Phantomjs生成PDF的实现方法
Nov 07 Javascript
localStorage的黑科技-js和css缓存机制
Feb 06 Javascript
vue2+el-menu实现路由跳转及当前项的设置方法实例
Nov 07 Javascript
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
SONY ICF-SW7600的电路分析
2021/03/02 无线电
dedecms模板标签代码官方参考
2007/03/17 PHP
中英文字符串翻转函数
2008/12/09 PHP
hessian 在PHP中的使用介绍
2010/12/13 PHP
php float不四舍五入截取浮点型字符串方法总结
2013/10/28 PHP
php将数组转换成csv格式文件输出的方法
2015/03/14 PHP
php实现微信发红包功能
2018/07/13 PHP
PHP实现字母数字混合验证码功能
2019/07/11 PHP
Laravel 5.2 文档 数据库 ―― 起步介绍
2019/10/21 PHP
详解no input file specified 三种解决方法
2019/11/29 PHP
在VS2008中使用jQuery智能感应的方法
2010/12/30 Javascript
判断对象是否Window的实现代码
2012/01/10 Javascript
Javascript前端UI框架Kit使用指南之Kitjs简介
2014/11/28 Javascript
node.js程序作为服务并在windows下开机自启动(用forever)
2017/03/29 Javascript
ionic 3.0+ 项目搭建运行环境的教程
2017/08/09 Javascript
微信小程序自定义多选事件的实现代码
2018/05/17 Javascript
微信小程序模拟cookie的实现
2018/06/20 Javascript
JavaScript两种计时器的实例讲解
2019/01/31 Javascript
解决微信小程序中转换时间格式IOS不兼容的问题
2019/02/15 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
2019/04/28 Javascript
[06:21]完美世界亚洲区首席发行官竺琦TI3采访
2013/08/26 DOTA
[01:03:33]Alliance vs TNC 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
[46:59]完美世界DOTA2联赛PWL S2 GXR vs Ink 第二场 11.19
2020/11/20 DOTA
pytorch cnn 识别手写的字实现自建图片数据
2018/05/20 Python
python导入不同目录下的自定义模块过程解析
2019/11/18 Python
使用卷积神经网络(CNN)做人脸识别的示例代码
2020/03/27 Python
HTML5中Canvas与SVG的画图原理比较
2013/01/16 HTML / CSS
日本PLST在线商店:日本时尚杂志刊载的人气服装
2016/12/10 全球购物
给老婆的婚前保证书
2014/02/01 职场文书
自主招生推荐信范文
2014/05/10 职场文书
政府个人对照检查材料
2014/08/28 职场文书
2014年学校领导班子对照检查材料
2014/09/19 职场文书
婚庆答谢词
2015/01/04 职场文书
幼儿园庆元旦主持词
2015/07/06 职场文书
2022微信温控新功能上线
2022/05/09 数码科技
nginx lua 操作 mysql
2022/05/15 Servers