这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了 javascript 密码验证的实现方法,过程很简单,适合初学者学习研究,需要的朋友可以参考下
本文为大家分享了 javascript 密码验证的实现方法,欢迎大家阅读。
javascript 密码验证代码如下
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- 密码验证
- </title>
- <script src="js/jquery-1.11.1.js">
- </script>
- <script>
- $(function() {
- $(document).on('blur', 'input',
- function() {
- var $password = $('#password').val();
- var $password_again = $('#password_again').val();
- if (!$password) {
- $("#password").addClass('redBorder').next('label').show().html('不能为空');;
- return false;
- } else if (!$password_again) {
- $("#password_again").addClass('redBorder').next('label').show().html('不能为空');
- return false;
- } else {
- $('input').removeClass('redBorder').next('label').empty();
- if ($password_again == $password) {
- $("#password,#password_again").next('label').show().html('两次密码一致').addClass('valid');
- } else if ($password_again != $password) {
- $("#password,#password_again").addClass('redBorder').next('label').show().html('两次密码不一致').removeClass('valid').addClass('erro');
- }
- }
- })
- })
- </script>
- <style>
- .redBorder{ border: 1px solid red; } .erro{ background: url('images/unchecked.gif')
- no-repeat; padding-left: 16px; } .valid{ background: url('images/checked.gif')
- no-repeat; width: 16px; height: 16px; }
- </style>
- </head>
- <body>
- <div>
- <label>
- 输入密码:
- <input type="text" placeholder="输入密码" id="password">
- <label id="password-erro" class="erro" style="display:none;">
- </label>
- </label>
- <br>
- <br>
- <label>
- 验证密码:
- <input type="text" placeholder="输入相同密码" id="password_again">
- <label id="password-erro" class="erro" style="display:none;">
- </label>
- </label>
- <br>
- <br>
- <button style="margin-left:80px;">
- submit
- </button>
- </div>
- </body>
- </html>
希望本文对大家学习 javascript 程序设计有所帮助。
来源: http://www.phperz.com/article/17/0415/268795.html