为我的搜索框创建参数化 URL答案

【问题标题】：Create parameterized URL for my Search box为我的搜索框创建参数化 URL
【发布时间】：2012-05-26 15:17:43
【问题描述】：

我有一个单独的 html 页面，它显示所有内容（我的意思是所有内容，表单提交、主页、表单结果……等等。很多 DOM 操作）它完全基于 ajax。我面临的问题是，我有一个搜索框，用户在其中输入 job_id 并显示有关该工作的所有信息，所有信息都在同一个 url 下

www.hostname.com/index.html

但我需要的是，当用户搜索 job_id 时，我的 url 应该类似于

www.hostname.com/index.html?jobid='abcd'

以便用户可以将此网址添加为书签，并可以通过访问链接获取信息。我只有一个 html 页面 (index.html)，我打算保持这种状态。我将如何去做？这样，如果用户输入 www.hostname.com/index.html，他会以默认外观进入 index.page，如果他输入 www.hostname.com/index.html?jobid='abcd'，则仅输出显示jobid。

PS：我正在使用 expressJS

【问题讨论】：

在加载时检查url中是否有参数并对其做出反应。如果找到jobid，填写表格并提交（或一组ajax请求）。
所以基本上我必须在客户端处理这个？，我在哪里解析 url。嗯。那很好，但假设我把这个表单放在 iframe 中，客户端解析仍然有效吗？因为，window.location 将指向别的东西。
服务器端是更好的选择，但我认为完全基于 ajax，您不需要客户端解决方案。你的信息不是那么令人满意;)
抱歉没有提到 iframe 。好吧，目前它还没有必要，但它肯定在路线图中。回到正题，鉴于我使用 ExpressJS，我将如何在服务器端执行此操作。我已经有了 '/' 和 '/index' 的路由规则。
expressjs.com/guide.html#req.param()

标签： javascript url node.js express

【解决方案1】：

一个简单且向后兼容的解决方案是使用location.hash (docs) 来保存您的参数。一些应用程序（例如 URL 缩短器）会删除哈希。

对于现代浏览器，您应该查看pushState，它允许您实际更改 URL。

【讨论】：

我确实想到了 window.location ，但是如果把这个表单放在 iframe 中会不会有问题？另外，所有现代浏览器都支持pushState吗，如果我使用iframe会不会有问题？
@Rahul 它不适用于 iframe。你为什么不通过 XHR 来做这一切呢？您还可以将表单上的target 属性设置为 iframe，然后它与根页面通信（如果您可以使用 ajax 进行通信，则毫无意义）。