在javascript中检查必要的标记字段的有效性

Question

我不想在我的表单上按“提交”按钮时执行提交操作，而是执行一些数据操作，然后使用javascript form.submit提交表单 - 因此我不使用{{我形式的1}}元素：

<input type="submit">

脚本类似于：

<input type="submit">

但在提交之前我想验证表单的条目和其他元素 - 我可以手动执行。但HTML5为我们提供了所需的许多其他属性 - 如何简单地集成它们？有<form action="process.php" method="post" name="myForm"> <input type="text" name="entry" id="entry" required /> <input type="button" value="Submit" onclick="manipulate_and_submit(this.form, this.form.entry);" /> </form> 之类的东西吗？谷歌搜索“验证javascript html表单”只是给我举例说明javascript中的手动验证“ye olde times”......

Answer 1

您可以使用checkValidity，这是HTMLFormElement提供的方法。在您的示例中，它将类似于if ( !form.checkValidity() ) { code here }。来自MDN：

  

[checkValidity]如果受约束验证的所有控件都满足其约束，则返回true;如果某些控件不满足其约束，则返回false。在任何不满足其约束的控件上触发名为invalid的事件;如果事件未被取消，则此类控制被视为无效。

Source

如上所述，它还会在每个无效的表单项上触发invalid事件。然后你可以让你自己的处理程序显示无效，就像所描述的in this answer。