javascript - 转到另一个网址而不重新加载页面

标签 javascript jquery html node.js socket.io

如果我转到域的子路径,正常的方法是执行 <a href="/somepath">Some Path</a> .这将完全重新加载页面。

但在 Facebook 上,当您打开照片时,地址栏上的 url 会发生变化,但是整个页面不会重新加载,它只会加载照片平台。所以通过这种方式,人们可以共享照片的 url。我想知道这是怎么做到的?

我做了一些搜索,有些人建议使用 history.pushState ,但是,这仅适用于大多数现代浏览器。 Facebook 上的那个也适用于 IE 7,我想知道他们是怎么做到的?

最佳答案

如您所说,history.pushState 仅在 modern browsers (noteably IE>=10) 上可用.

对于旧版浏览器,以任何方式更改 URL 的唯一方法(据我所知)是使用 "hashbang" technique - 使用/滥用 URL 中的散列功能来保留页面信息。然后,您会得到一个类似于 index.php#!page=x&foo=bar 的 URL,其中哈希将用于表示当前页面。然后 URL 将与一个链接一对一映射,例如 index.php?page=x&foo=bar,并且在刷新页面时,JavaScript 可以读回散列并适本地显示页面。这绝不是一个很好的解决方案,特别是浏览器不能正确存储您的历史记录,但它仍然很受欢迎。

如果您希望使用 Ajax 重新加载页面并同时更改 URL,那么也许可以查看 History.js 等库/Ajaxify ,它将尝试在可用的地方使用 pushState,但在必须的地方回退到使用 hashbangs。

您似乎认为 facebook 支持 Legacy IE 的 Ajax。我不知道这一点,因为我不能说 IE7 是我经常使用的浏览器,但 IIRC Twitter 对较旧的、功能较少的浏览器的时间要少得多,并且会退回到简化得多的界面(我 < em>认为它甚至使用基本的移动 View )。如果是我的网站,我可能会采取类似的立场,并在可用的地方使用 pushState,在没有的地方简单地提供独立页面。在这些领域进行向后兼容性的工作往往相当艰巨(尽管上述插件会减轻相当大的负担),除非您需要提供支持,否则这可能不值得吗?

关于javascript - 转到另一个网址而不重新加载页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18329531/

相关文章:

javascript - 如何通过 JavaScript 管理 Google 帐户的联系人?

html - Chrome 的 "save password"功能将用户名放在不相关的字段中

javascript - 获取 Div 中子元素的值并将其放入列表或新 div 中

javascript - 如果图像尺寸很大,请禁用 angularjs 表单提交按钮

jquery - 这可能是 Bootstrap 轮播缩略图在桌面上显示 4 列,在移动设备上显示 2 列吗?

javascript - 相当于在vanillajs中设置html和body height为window height

javascript - 在运行时更改 CKEditor 击键

javascript - angular-animate.js 中的奇怪错误

javascript - 我不明白使用字符串和 bool 值的逻辑运算符

javascript - 单击可以同时打开图像主菜单和搜索框的两个菜单?它应该打开一个菜单并关闭另一个