将 HTML 表单与 URL 查询字符串同步？答案

【问题标题】：Sync HTML form with URL query string?将 HTML 表单与 URL 查询字符串同步？
【发布时间】：2016-01-11 20:15:49
【问题描述】：

在 eBay 等网站上，返回搜索页面后，搜索选项均已填写。我想对我的网站执行相同操作，目前，返回搜索页面会返回正确的搜索结果，但搜索表单为空。

到目前为止我看到的两种方法：

用 HTML 编写表单，使用 JS 解析查询字符串并设置表单值。

How can I pre-populate html form input fields from url parameters?

在 JS 中使用查询字符串中的任何值生成表单，如果没有给出查询字符串，这将生成一个空白表单。

Query String for pre-filling html form field

这两种解决方案看起来都很老套。我想这是一项常见的任务，是否有标准或干净的方法可以在一两行中执行此操作？

显然有一些东西可以将表单中的字段序列化为查询字符串，应该有一种方法可以反过来使用它来获取查询字符串并填写表单字段，而不必“滚动你自己的”循环在 JS 中。

【问题讨论】：

HTTP 是一种无状态协议。正如 Derek Pollard 所建议的那样，“记住”事物的一种方法是使用会话/cookie。您可以使用 HTML5 本地存储在服务器端或客户端执行此操作。或使用 GET 参数，例如您使用的引用。如果您想隐藏某些信息，可以尝试使用某种编码/解码来隐藏 URL 中的信息。
如果您使用服务器端语言，一种方法是在会话中保存当前搜索页面的 uri（当然，所有获取参数），以便稍后在需要时轻松访问。预填充通常是通过这些 get 参数完成的。
是的，但也许我没有写一个明确的问题，我添加了一些东西来帮助解释我到底在寻找什么。我知道这是可以做到的，但通常的做法对我来说似乎效率很低。
@neoDev 我正在寻找解决方案。
使用 JavaScript。我没有标记 PHP。请不要删除您以前的 cmets。

标签： javascript html forms

【解决方案1】：

我建议将信息保存在 session/cookie 中并从中提取以填充表单。这就是在 eBay 上的做法。

【讨论】：

但如果用户分享了指向搜索页面的链接，在另一台计算机上打开该链接将不会显示相同的内容。
如果您也使用GET 参数来填充字符串形式，它也会这样做。
@DavidTan，这是因为点击该链接的用户不是来自搜索页面，并且无法知道其他用户搜索的内容。通常不同的用户可以在不同的搜索后访问同一页面。

【解决方案2】：

只需使用GET 参数即可。

http://sample.com/?search=pen&color=blue

现在在构建表单元素时，只需执行以下操作：

$search = isset($_GET['search']) ? $_GET['search'] : '';
$color = isset($_GET['color']) ? $_GET['color'] : '';

echo "<input type='text' value='{$search}' placeholder='Search' />";
echo "<input type='text' value='{$color}' placeholder='Color' />";

【讨论】：

也许他对 PHP 说不