如何将 HTML 表单数据作为路径而不是作为查询字符串附加到 URL 中？答案

【问题标题】：How to append HTML form data into the URL as path and not as a query string?如何将 HTML 表单数据作为路径而不是作为查询字符串附加到 URL 中？
【发布时间】：2021-07-21 15:30:10
【问题描述】：

所以带有 get 的典型 HTML 表单如下所示：

<form action="https://mywebsite.com/mypage" method="get">
  <input type="text" id="myparam" name="myparam">
  <input type="submit" value="Submit">
</form>

并将用户带到： https://mywebsite.com/mypage?myparam=value

但是，我想知道我的表单是否可以将我的用户带到： https://mywebsite.com/mypage/value ?基本上，将myparam 输入的值添加到 url 末尾的路径中。

提前致谢！

【问题讨论】：

我想我可以编写一个 JavaScript 函数，根据输入内容重定向用户，但这似乎不是最好的方法，是吗？

标签： javascript html forms url

【解决方案1】：

您可以创建 javascript 函数，也可以声明一个后端函数，并将重定向返回到您的请求路由

document.querySelector('form').addEventListener("submit", function (e) {
    e.preventDefault()
    
    let param = document.querySelector('input[name="myparam"]').value

    window.location.href = 'https://mywebsite.com/mypage/' + param
})

【讨论】：

是的，这就是我最终所做的。有没有办法用表格来做？
另一个你可以写 htaccess 或 nginx 重写规则但是你不能用 form 来做