从链接提交表单与从按钮提交表单（Chrome）答案

【问题标题】：Form submission from link vs Form submission from button (Chrome)从链接提交表单与从按钮提交表单（Chrome）
【发布时间】：2019-08-25 12:07:29
【问题描述】：

我有一个包含链接的表单。如果用户点击<a> 标签，它应该使用jQuery 提交<form>。但是，在 Chrome 中它会默默地失败。它在 Firefox 中运行良好。

我发现如果我将 a 更改为 button 元素，它可以正常工作，即使在 Chrome 中也是如此。谁能解释一下？

function javaScriptSubmit() {
  alert('Simulate submit!');
  $('#RetrieveQuote').submit();
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form id="RetrieveQuote" method="post" action="javascript:alert('action!')">
  <input id="myName" value="David"> <br/>
  <a href="javascript:void(0);" onclick="javaScriptSubmit()">Submit from link</a>
  <button onclick="javaScriptSubmit()">Submit from button</button>
</form>

如果您在 Chrome 中并单击该链接，则永远不会调用操作警报。但是，如果您单击该按钮，您会看到两条警报消息。在 FireFox 中单击任一工作。

【问题讨论】：

标签： javascript jquery html google-chrome firefox

【解决方案1】：

试试这个：

 <html>
  <head>
    <title>test</title>
    <script
      src="https://code.jquery.com/jquery-3.3.1.js"
      integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
      crossorigin="anonymous"
    ></script>
  </head>
  <body>
    <form id="RetrieveQuote" method="post" action="javascript:alert('action!')">
      <input id="myName" value="David" /> <br />
      <a href="#" id="submit-link">Submit from link</a>
      <button>Submit from button</button>
    </form>
    <script>
      $("#submit-link").click(function() {
        $("#RetrieveQuote").submit();
      });
    </script>
  </body>
</html>

【讨论】：

我做了更多的测试，解决它的不是事件处理程序的设置，而是摆脱了解决它的 href="javascript:void(0)"。跨度>
你能解释一下这里到底发生了什么吗？