如何停止表单提交？

Question

我是 JavaScript 的新手。如果任何验证条件返回 false，我需要阻止提交表单。

例如：-

if((document.getElementById("name").value)==""){
    alert("'Name' field can not be empty");
    return false;
}

我尝试了 <form onsubmit="return validate();"> 和 <form onsubmit="event.preventDefault(); validate();">。 None 的帮助。第一个提示相同的警报消息两次。第二个连续提示所有警报消息。我想要的是，

如果有一个错误条件，我需要浏览器停止提交表单并提示相关的警告信息。
如果有多个错误条件，我需要浏览器停止表单提交，只提示一个警告信息。

有什么方法可以通过使用 JavaScript（没有 JavaScript 库）来实现吗？

抱歉，如果有任何语法错误，英语不是我的第一语言:(

Answer 1

您需要调用从EventListener 的回调函数中获取的作为参数的事件对象的preventDefault。像这样：

...
<head>
<script>
window.addEventListener("load",init);
function init()
  {document.getElementById("form").addEventListener("submit",function(e)
     {e.preventDefault();});}
</script>
</head>
<body>
<form id="form">
  <input type="submit">
</form>
</body>
...

您可以随意调用该参数，也可以在其他地方定义该函数。

...
<script>
window.addEventListener("load",init);
function init()
  {document.getElementById("form").addEventListener("submit",handleSubmit);}
function handleSubmit(event)
  {event.preventDefault();}
</script>
...

如何停止表单提交？

How to stop form submission?

html

javascript

forms

events