如何在 Javascript 中以编程方式获取 HTML 表单的最终提交 URL

Question

我有一个简单的 HTML 表单，它使用 GET 而不是 POST。

<form id="form" action="https://www.example.com/search" method="GET">
    <input name="foo" type="text" />
    <input name="bar" type="text" />
    <input type="submit" value="submit" />
</form>

当用户点击“提交”时，我希望他们被定向到像 http://www.example.com/search?foo=abc&bar=123 这样的 URL，即附加了查询字符串的操作 URL。

有没有一种简单的方法可以在 Javascript 中以编程方式获取带有查询参数的最终表单 URL，而无需构建它？类似document.getElementById('form').submissionURL

Answer 1

使用 Jquery 序列化你应该能够完成这项工作

$( "form" ).on( "submit", function( event ) {
  event.preventDefault();
  var submitURL=$( '#form' ).attr( 'action' );
  if(submitURL.indexOf("?")==-1)
  {
  console.log( submitURL+'?'+$( '#form' ).serialize() );
  }
  else
  {
  console.log( submitURL+'&'+$( '#form' ).serialize() );
  }

});

https://jsfiddle.net/zrypfens/1/