首页 > 解决方案 > 从链接提交表单与从按钮提交表单(Chrome)

问题描述

我有一个包含链接的表单。如果用户点击<a>标签,它应该提交<form>使用 jQuery。但是,在 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 中单击任一工作。

标签: javascriptjqueryhtmlgoogle-chromefirefox

解决方案


试试这个:

 <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>

推荐阅读