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 相关文章推荐
搭建pomelo 开发环境
Jun 24 Javascript
jQuery操作cookie方法实例教程
Nov 25 Javascript
javascript实现修改微信分享的标题内容等
Dec 11 Javascript
AngularJS中的过滤器使用详解
Jun 16 Javascript
iframe中子父类窗口调用JS的方法及注意事项
Aug 25 Javascript
使用js获取地址栏参数的方法推荐(超级简单)
Jun 14 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
Oct 13 Javascript
详解js中==与===的区别
Jan 08 Javascript
JS实现上传图片实时预览功能
May 22 Javascript
微信小程序左滑删除实现代码实例
Sep 16 Javascript
vue遍历生成的输入框 绑定及修改值示例
Oct 30 Javascript
Vue路由权限控制解析
Nov 09 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
PHP实现分页的一个示例
2006/10/09 PHP
php去除换行(回车换行)的三种方法
2014/03/26 PHP
利用PHP计算有多少小于当前数字的数字方法示例
2020/08/26 PHP
JQuery 学习笔记 选择器之二
2009/07/23 Javascript
使用indexOf等在JavaScript的数组中进行元素查找和替换
2013/09/18 Javascript
Javascript中的匿名函数与封装介绍
2015/03/15 Javascript
javascript中$(function() {});写与不写有哪些区别
2015/08/10 Javascript
js实现全国省份城市级联下拉菜单效果代码
2015/09/07 Javascript
JavaScript和HTML DOM的区别与联系及Javascript和DOM的关系
2015/11/15 Javascript
原生js页面滚动延迟加载图片
2015/12/20 Javascript
浅谈JavaScript前端开发的MVC结构与MVVM结构
2016/06/03 Javascript
快速解决js动态改变dom元素属性后页面及时渲染的问题
2016/07/06 Javascript
HTML Table 空白单元格补全的简单实现
2016/10/13 Javascript
Bootstarp 基础教程之表单部分实例代码
2017/02/03 Javascript
vue.js input框之间赋值方法
2018/08/24 Javascript
JavaScript 实现HTML DOM增删改查操作的常见方法详解
2020/01/04 Javascript
9个JavaScript日常开发小技巧
2020/10/06 Javascript
Python获取apk文件URL地址实例
2013/11/01 Python
Python文件操作类操作实例详解
2014/07/11 Python
Python实现运行其他程序的四种方式实例分析
2017/08/17 Python
浅谈Python NLP入门教程
2017/12/25 Python
python针对excel的操作技巧
2018/03/13 Python
python实现超市扫码仪计费
2018/05/30 Python
python3 读取Excel表格中的数据
2018/10/16 Python
英国最大的独立玩具专卖店:The Entertainer
2019/09/06 全球购物
日本即尚网:JSHOPPERS.com(支持中文)
2019/12/03 全球购物
金智子午JAVA面试题
2015/09/04 面试题
网络安全类面试题
2015/08/01 面试题
酒店个人求职信范文
2014/01/25 职场文书
小学少先队活动方案
2014/02/18 职场文书
春季运动会广播稿大全
2014/02/19 职场文书
计算机专业应届生求职信
2014/04/06 职场文书
党的群众路线教育实践活动个人批评与自我批评
2014/10/16 职场文书
捐款感谢信
2015/01/20 职场文书
八一建军节主持词
2015/07/01 职场文书
2016年五四青年节校园广播稿
2015/12/17 职场文书