Rumah > hujung hadapan web > tutorial js > javascript kata laluan verification_javascript kemahiran

javascript kata laluan verification_javascript kemahiran

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-05-16 15:33:01
asal
1403 orang telah melayarinya

Artikel ini berkongsi dengan anda cara melaksanakan pengesahan kata laluan JavaScript Anda dialu-alukan untuk membacanya.

 

Kod pengesahan kata laluan javascript adalah seperti berikut

<!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>
Salin selepas log masuk

Saya harap artikel ini akan membantu semua orang dalam mempelajari pengaturcaraan javascript.

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan