首页 > 编程 > JavaScript > 正文

javascript密码验证

2019-11-20 11:18:34
字体:
来源:转载
供稿:网友

本文为大家分享了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程序设计有所帮助。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表