Javascript 必需属性不适用于 e.preventDefault

Question

我有一个带有所需属性的输入的表单。但是，我不希望表单正常提交，但它使用 ajax。因此，我将表单操作设置为javascript:void(0) 。但是这样做会呈现required的属性没用。它不起作用

我该如何解决？

这是我的表格

<form action="javascript:void(0)"> <input name="email" required> </form>`

Answer 1

所以使用表单上的提交处理程序并取消默认操作。

 document.querySelector("#myForm").addEventListener("submit", function (evt) { evt.preventDefault(); // do you ajax submission here console.log('submitted') })

 <form id="myForm"> <label for="email">email:</label> <input id="email" name="email" type="email" required> <button>Submit</button> </form>

Answer 2

如果您自己提交，您可以使用以下方式检查表单的有效性

if (form.checkValidity()) {
  // submit via XHR etc...
} else {
  // the form is not valid
}

看到这个和这个

Answer 3

这样做可以帮助你

 <form name="myForm"> <input name="email" required> <input type="submit" value="submit"> </form> <script> document.myForm.onsubmit = e => { e.preventDefault(); } </script>