使用 Javascript 函数通过 onSubmit 向 url 添加参数答案

【问题标题】：Add parameters to url with onSubmit using a Javascript function使用 Javascript 函数通过 onSubmit 向 url 添加参数
【发布时间】：2018-03-01 20:38:26
【问题描述】：

我想通过 onsubmit 将 html 参数添加到 url。我有 2 个表单（1 个 GET，1 个 POST），想要使用 1 个按钮来提交它们（使用 POST 表单按钮）按下提交按钮时，使用 onSubmit 调用 javascript 函数，其中参数“附加”到网址。

我正在考虑做这样的事情：

function onSubmitForm() {
    url = "localhost:8080/test/index.php?Title=document.getElementsByName('title')[0].value";
    //I don't know how to actually call the url.
}

编辑

我得到了我想要的： Appending form input value to action url as path

【问题讨论】：

标签： javascript php html

【解决方案1】：

首先，您必须连接字符串的静态和动态部分。然后，您可以重定向。

function onSubmitForm() {
  window.location = "localhost:8080/test/index.php?Title=" + 
    document.querySelector('title').textContent;
}

注意事项：

只有表单域具有.value 属性。如果你想得到元素内的文本，可以使用.textContent。
.getElementsByName() 扫描整个文档并制作一个所有匹配元素的集合。当你这样做很浪费知道你只想要第一个，对于<title>，有无论如何，它只会成为文档中的其中一个。采用 .querySelector() 仅定位第一个匹配元素。

【讨论】：

似乎无法正常工作。我已经完成了代码，这是 3 行代码，但我以某种方式设法将其删除。这是我从中获得的stackoverflow帖子，现在我看到每个人都在建议window.location，这在我的情况下不起作用，不幸的是我无法让它工作。无论如何谢谢你。
@CrimzonWeb 您需要确保在整个 HTML 文档被解析后运行此代码。因此，将此代码放入<script> 元素中，并将该元素插入到关闭body 标记（</body>）之前。只要您的 <title> 元素有值，这将起作用。

【解决方案2】：

ES6

注意事项：

不要忘记使用 Babel 在 ES5 中转换代码。

我打算给你这个解决方案：

function onSubmitForm() {
  window.location = `localhost:8080/test/index.php? Title=${document.querySelector('title').textContent}`
}

这种使用反引号的方法比在 ES5 中更简单，让我解释一下，在我们必须与符号 + ourVariable + 连接字符串的延续之前。

这里我们有更多。我们也可以写几行。然后${}里面用来传递一个变量

如果需要，请提供文档：Literal template string

【讨论】：

这不是答案。它没有解释正在做什么以及为什么。
您在回复中解释了原因。我认为了解 ES6 的良好实践很重要 :)
如果我的答案被删除了怎么办？那么，您的回答有多大帮助？
这有点好，但最好包含指向 ES6 模板化字符串文档的链接。答案应始终尽可能完整。
让我们continue this discussion in chat.