我在登录函数中添加了一个断点。当我提交表单时，应该调用登录函数；但它没有被调用。当我登录时，页面不会重定向到 window.location。如果登录凭据与本地存储中的登录凭据相同，我希望重定向页面。我知道我们不应该验证您的代码客户端。但现在，我们先忽略它。
var db = window.localStorage;
function signUp() {
var signupFormDt = document.querySelector('#signup-form');
var email = signupFormDt.querySelector('input[name="email"]');
var password = signupFormDt.querySelector('input[name="password"]');
var userName = signupFormDt.querySelector('input[name="name"]');
db.setItem(userName.name, userName.value);
db.setItem(email.name, email.value);
db.setItem(password.name, password.value);
}
function login() {
var loginFormDt = document.querySelector('#login-form');
var logEmail = loginFormDt.querySelector('input[type="email"]');
var logPass = loginFormDt.querySelector('input[type="password"]');
if (db.email == logEmail.value && db.password == logPass.value) {
window.location = 'http://www.google.com';
} else {
window.location = "http://www.google.com";
}
} <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<!--Link to StyleSheet-->
<link rel="stylesheet" href="../css/style.css">
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
</head>
<body>
<header>
<div class="container">
<h1>
<a href="#"></a>
</h1>
<nav>
<ul class="clearfix">
<li>
<a href="#">
<h4>Home</h4>
</a>
</li>
<li>
<a href="../html/about.html">
<h4>About</h4>
</a>
</li>
<li>
<a href="#">
<h4>Contact</h4>
</a>
</li>
<li>
<a href="#">
<h4 id="social">Social</h4>
<div class="arrow"></div>
<ul>
<li>Twitter</li>
<li>Facebook</li>
<li>Instagram</li>
<li>Snapchat</li>
<li>Tumblr</li>
</ul>
</a>
</li>
</ul>
<!-- end of ul of main nav-->
</nav>
<!--end of nav-->
</div>
<!--end of container-->
</header>
<main>
<section>
<h3>login Page</h3>
<div id="login">
<p><a href="../html/index.html" title="link to home page">Myselfie Tech</a></p>
<form method="Post" id="login-form">
<p>
<input type="email" name="email" id="email" placeholder="email" required>
</p>
<p>
<input type="password" name="password" id="password" placeholder="password" required>
</p>
<p>
<button type="submit" onsubmit="login()">Submit Query</button>
</p>
<p>
<button onclick="window.location='../html/index.html'">Back</button>
</p>
</form>
</div>
</section>
</main>
<footer>
<p>
<center><small>©Copyright 2017 programmers inc.</small></center>
</p>
</footer>
<!--Link to Javascript-->
<script src="../javascript/scripts1.js"></script>
</body>
</html>最佳答案
button 元素没有 onsubmit 属性。您应该将该属性放在 form 标记上才能使其正常工作。还要确保取消表单提交，因为您想使用 window.location:
添加
返回:<form onsubmit="return login();">在
location后添加return false和.href:function login() { var loginFormDt = document.querySelector('#login-form'); var logEmail = loginFormDt.querySelector('input[type="email"]'); var logPass = loginFormDt.querySelector('input[type="password"]'); if (db.email == logEmail.value && db.password == logPass.value) { window.location.href = 'http://www.google.com'; } else { window.location.href = "http://www.google.com"; } return false; // <------ }
关于javascript - 为什么代码中的登录函数没有被调用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45494005/