javascript - 在不调用操作页面的情况下检索表单提交生成的 URL

标签 javascript html forms

考虑以下 HTML 标记:

<form method="GET">
  <input type="text" name="a" value="one">
  <input type="text" name="b" value="two">
  <input type="text" name="c" value="three">
  <input type="submit">
</form>

如果上面没有 JS,它会自然地加载带有查询字符串 ?a=one&b=two&c=three 的操作页面(在本例中为自身)。

但是,我不想加载操作页面并使用一些 JS 来阻止它:

document.querySelector("form").addEventListener("submit", function(e) {
  // Do some stuff
  e.preventDefault();
});

现在的问题是没有生成查询字符串,我必须使用以下方法手动计算它:

var queryString = "?" + [].map.call(document.querySelectorAll("input[type=text]"), function(element) {
  return element.name + "=" + element.value;
}).join("&");
console.log(queryString); // Displays "?a=one&b=two&c=three"

有没有什么办法可以避免这种情况并获取本来应该发送到操作页面的查询字符串?


编辑:我正在使用纯 JavaScript,我不是在寻找涉及 jQuery 或其他 JS 框架的解决方案。

最佳答案

我不这么认为。要生成请求,您必须提交。

关于javascript - 在不调用操作页面的情况下检索表单提交生成的 URL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21367367/

相关文章:

php - 从 SQL 表中提取照片和照片 ID,并将它们显示在 PHP 页面的列表中

html - 在构建和设置表单样式时,使用 <table> 标签还是 <div> 标签更好?

ruby-on-rails - Rails 验证最佳实践

javascript - 未选中单选按钮的验证通过

javascript - 使用 javascript 从字符串原型(prototype)返回值

javascript - 按名称获取文件时,Google 电子表格错误未发送文件

javascript - 通过 javascript 链接到另一个带有书签的页面,这可能吗?

javascript - 如何删除 Awesomium.net 滚动条? & 自动滚屏?

javascript - 动态填充两个对象之间的空间

javascript - 将 div 调整到 body 的左侧和另一个 margin 为 auto 的 div 之间