Javascript價值變化TypeError zxcvbn

所以我試圖做一個米，如果用戶輸入的密碼是強大的使用zxcvbn，但雖然代碼在codepen上工作，它會拋出一個TypeError: password is null在我的瀏覽器，並沒有更新儀表爲我在密碼輸入上鍵入字母。Javascript價值變化TypeError zxcvbn

代碼：

HTML：

<script src="https://cdnjs.cloudflare.com/ajax/libs/zxcvbn/4.2.0/zxcvbn.js"></script> 

<input class="form-control" type="password" id="password" /> 
<div id="pwd-container"> 
    <meter max="4" id="password-meter"></meter> 
</div>

的Javascript：

var password = document.getElementById('password'); 
var meter = document.getElementById('password-meter'); 

password.addEventListener('input', function() { 
    var val = password.value; 
    var result = zxcvbn(val); 

    meter.value = result.score; 
});

來源

2016-11-11 user7148024

你可能把你的JS代碼上面HTML。試試這個：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title></title> 
</head> 
<body> 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/zxcvbn/4.2.0/zxcvbn.js"></script> 

    <input class="form-control" type="password" id="password" /> 
    <div id="pwd-container"> 
     <meter max="4" id="password-meter"></meter> 
    </div> 

    <script type="text/javascript"> 

    var password = document.getElementById('password'); 
    var meter = document.getElementById('password-meter'); 

    password.addEventListener('input', function() { 
     var val = password.value; 
     var result = zxcvbn(val); 

     meter.value = result.score; 
    }); 

    </script> 

</body> 
</html>

來源

2016-11-11 21:49:16

Javascript價值變化TypeError zxcvbn

回答

相關問題