javascript - 使用 Anchor 提交时表单未验证

Question

我正在尝试使用锚标记提交表单。但是，验证功能似乎没有被触发。我已经用提交按钮替换了锚点，现在它可以工作了。不过，我很好奇为什么以前的锚链接不起作用。

代码是

function validate() {

/* validation code here */

return status;

}

<form id="myForm" action="/response_page.php" onsubmit="return validate();" method="POST">

<!-- form elements here -->

<a href="#" class="submit_button" onclick="document.getElementById('myForm').submit();">Submit</a>

</form> 

使用此代码，单击链接会直接转到 *response_page.php*。但是当替换为提交按钮时

<input type="submit" value="submit" /> 

在不更改验证函数和表单标签的情况下，验证函数被正确调用。锚怎么了？

谢谢

Answer 1

这是预期的行为。

从提交功能的MDN：

从基于 Gecko 的应用程序调用此方法时，不会触发表单的 onsubmit 事件处理程序（例如，onsubmit="return false;"）。一般来说，它不能保证被 HTML 用户代理调用。

如果您想验证链接中的代码，只需validate显式调用该函数：

<a id=subbut href="#" class="submit_button">Submit</a>
...
document.getElementById('subbut').addEventListener('click', function(){
    if (validate()) document.getElementById('myForm').submit();
});