我正在为网站构建登录页面，但是我遇到一个问题，即“登录”按钮仅在该按钮的第二次单击时有效。第一次点击似乎根本没有任何作用，但是第二次点击效果很好...我在哪里出错？我的猜测是，它与eventListener的工作方式有关，但我找不到它。
后面是简化的代码。
干杯， 丰富
<html>
<body>
<input type="email" id="email">
<input type="password" id="password">
<button id="login">Sign in</button>
<script>
document.getElementById("login").addEventListener("click", function(){
var un = document.getElementById("email").value;
var pw = document.getElementById("password").value;
var data = '{"username":"' + un + '", "password":"' + pw + '"}';
var xhr = new XMLHttpRequest();
xhr.responseType = 'json';
xhr.addEventListener("readystatechange", function() {
if(this.status === 200 && this.readyState === 4) {
jr = this.response;
window.open("https://cs.blah.com/" + jr.redir, "_self");
}
});
xhr.open("POST", "https://api.blah.com/clientservices/auth");
xhr.setRequestHeader("Content-Type", "application/json");
xhr.send(data);
});
</script>
</body>
</html>