2009-10-08

password bar javascript

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
 <head>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  <title>Javascript Password Strength</title>
   
  <script type="text/javascript">
 
   function passwordStrength(pass)
   {
   
    var score = 0;
    
    if(pass.length > 2)
     score++;
     
    if(pass.length > 4)
     score++;
     
    if(pass.length > 8)
     score += 2;
    
    if(/\w/.test(pass) && /\d/.test(pass))
     score++;
          
    return score * 2 * 10;
       
   }
  </script>
  
  <style type="text/css">
  
   body {
    font-family: Tahoma, verdana, sans-serif; 
    font-size: 11px;
    padding: 30px;
   }
   
   a {
    font-weight: bold;
    color: #3366cc
   }
  
   fieldset {
    padding: 20px;
    border: 1px solid #dcddcc;
    width: 200px; 
   }
   
   fieldset legend {
    font-weight: bold; 
   }
   
   #passmeter {
    width: 0px; 
    background: #629d48;
    height: 3px;
   }
   
   #passmeterbg {
    height: 3px;
    background: #f1f1f1;
    width: 200px; 
   }
  
  </style>
    
 </head>
 
 
 <body>
 
 
  <fieldset>
   <legend>Enter a password</legend>
   <input type="text" onkeyup="document.getElementById('passmeter').style.width = passwordStrength(this.value) + '%';" />
  
   <br /><br />
   
   <p>Password Strength:</p>
   <div id="passmeterbg">
    <div id="passmeter"></div>
   </div>
  </fieldset>
 
  <br /><br />
  
  
  
 </body>
 
</html>

Yahoo!香港提供網上安全攻略，教你如何防範黑客!了解更多

發佈者： 香港818 於 10/08/2009  

0 留言:

發佈留言

訂閱： 發佈留言 (Atom)