简单的表单与preventDefault不工作(没有任何jquery)



我有一个简单的html表单和Javascript。我一直试图阻止表单提交。但它忽略了我的代码e.preventDefault(),并继续提交和刷新页面。

我遇到的大多数解决方案包括JQuery。这不能没有JQuery吗?
为什么不工作?有什么问题吗?

<html>
<head>
<script>
function onsubmit(e) {
e.preventDefault();
e.stopPropagation();
console.log("submitting...");
return false;
}
</script>
</head>
<body>
<form method="POST" onsubmit="onsubmit">
<input placeholder="email" style="display:block"> </input>
<input placeholder="password" style="display:block"> </input>
<input type="submit" value="login" style="display:block"> </input>
</form>
</body>
</html>

虽然我不知道内联事件侦听器不起作用的原因,正如@teemu在评论中建议的那样,当我放弃内联onsubmit事件侦听器而使用addEventListener时,它为我工作。

document.addEventListener("DOMContentLoaded", (e)=>{
document.querySelector("form").addEventListener("submit", onsubmit);
}

将此添加到<script>中,并且它有效

最新更新