[英]Log in form not redirecting to new page / registering log in
Have tried different methods of validating username and password, and sending to the new page but page just reloads after clicking button.尝试了不同的方法来验证用户名和密码,并发送到新页面,但页面只是在单击按钮后重新加载。 Had thought preventDefault() would stop this.以为 preventDefault() 会阻止这个。 If anyone notices the problem, please let me know, thanks.如果有人发现问题,请告诉我,谢谢。
const loginForm = document.querySelector('login-form') const loginButton = document.querySelector('login-form-submit') loginButton.addEventListener("click", (e) => { e.preventDefault(); const username = loginForm.username.value; const password = loginForm.password.value; if (username === 'admin' && password === 'admin1') { alert("You have logged in;"). window.open('Data;html'); } else { alert("Incorrect Password"); } })
<div class="signin"> <form id="login-form"> Sign in to access your account <br> <br> <label for="name">Account Name:</label> <input type="text" id="username-field" name="username" class="login-form-field" placeholder="Username"><br><br> <label for="password">Account Password:</label> <input type="password" id="password-field" name="password" class="login-form-field" placeholder="Password"><br><br> <input type="submit" value="Log In" id="login-form-submit"> </form> </div>
The easiest way to do is to use input type="button"
, just change from submit
to button
最简单的方法是使用input type="button"
,只需将submit
更改为button
<input type="button" value="Log In" id="login-form-submit" />
Also, you have an error in your d ocument.querySelector
.此外,您的ocument.querySelector
中有错误。 To get element by id, you need to use #
like要通过 id 获取元素,你需要使用#
like
document.querySelector('#login-form-submit')
loginForm.addEventListener('submit', function(e){
e.preventDefault();
const username = e.currentTarget.querySelector('[name="username"]').value;
const password = e.currentTarget.querySelector('[name="password"]').value;
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.