<button type="submit" > IE 和 chrome 中的行为不同：为什么？

Question

表单在 IE（Internet Explorer 版本：11.713.10586.0）中提交了两次，但在 Chrome 中只提交了一次。

<div id="pageButtons">
  <button type="submit" onClick="sendAction('submit')"> Submit </button>
</div>

sendAction 函数是这样的：

function sendAction(anAction){
   document.form._action.value = anAction ;
   document.form.submit();
}

所以由于按钮类型是提交并且在函数 sendAction 中我正在通过代码提交，所以表单同时提交了两次。

所以我将按钮 HTML 部分更改为：

<div id="pageButtons">
      <button type="button" onClick="sendAction('submit')"> Submit </button>
</div>

然后它在 IE 中运行良好。现在我无法理解的是，如果 type="submit" 事情导致在 IE 中两次提交表单，为什么它在 Chrome 中工作正常。在 chrome 中，它也应该提交两次，因为按钮类型是提交，而且我还硬编码了“document.form.submit()”。

谁能告诉我原因？

Answer 1

您的按钮在sendAction() 函数执行后继续执行，导致双重表单提交（一次作为sendAction() 函数的一部分，一次作为正常HTML 的一部分<form><button type="submit"> 行为。

尝试在你的函数中添加return false：

function sendAction(anAction){
   document.form._action.value = anAction ;
   document.form.submit();
   return false;
}

并在您的 onClick 中添加return：

<button type="button" onClick="return sendAction('submit');"> Submit </button>

这将允许sendAction() 触发表单提交，但随后return false 返回onClick()，这将阻止<button> 的正常行为。

Chrome 足够聪明，可以更好地了解上面的 Sagar V。 IE，没那么聪明：}