我有以下 HTML 代码
<div class = "login">
<form>
<input type="text" id="username" name="username" placeholder="Username" style="text-align:center"> <br> <br>
<input type="password" id="password" name="password" placeholder="Password" style="text-align:center"> <br> <br>
<input onclick="loginButton();" name="login_btn" id="login_btn" type="submit" value="Login">
</form>
</div>
以及以下 JavaScript:
<script type="text/javascript">
function loginButton() {
console.log("this function was called")
}
</script>
在我的控制台中,当我单击提交按钮时,“已调用此函数”仅出现一秒钟,然后消失。然而,当我将提交按钮放在表单之外时,消息会保留下来,并完全执行我的其余功能。
最佳答案
您的表单被提交并重新加载页面 - 由于 input
元素上的 type="submit"
。
将其更改为
类型=“按钮”
或
onclick="loginButton();返回 false;"
关于JavaScript 无法在表单内运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37468040/