【问题标题】:how to change url in browser url box?如何更改浏览器网址框中的网址?
【发布时间】:2011-11-14 09:55:20
【问题描述】:

我真的很想知道为什么 facebook 和 google 可以在不重新加载页面的情况下更改 url?他们只是更改网站中的块或内容。

我注意到当我使用 facebook 时,当点击“new feed”时,url 是“http://www.facebook.com/”并且页面没有重新加载,然后我点击“messages”网址更改为“http://www.facebook.com/messages/”,页面仍未重新加载,只需更改网站的“内容”块。

那么如何在不重新加载页面的情况下更改 url?

编辑:我得到了答案。
这里有两种情况:

  • 浏览器支持html5(Firefox 3.6 +等):使用html5历史。 (例如:www.facebook.com => www.facebook.com/messages)
  • 浏览器不支持 html5(IE6、IE7、IE8 等):使用井号 (#)(例如:www.facebook.com => www.facebook.com/#!/messages)

希望对像我一样有疑问的人有所帮助。

【问题讨论】:

    标签: php javascript jquery


    【解决方案1】:

    您是否查看过 JavaScript 的历史 API?

    http://diveintohtml5.ep.io/history.html

    编辑:您也可以将 mod_rewrite 与 apache 一起使用,然后再使用,但这会导致刷新。

    或者有这个JQuery插件

    http://www.asual.com/jquery/address/

    【讨论】:

    • 是 HTML5 吗?那么IE呢?
    • @Alwayz 更改:还有github.com/balupton/History.js 具有 HTML4 的后备功能。
    • @pimvdb,感谢链接,我会试试的,因为我真的需要它,我建立了一个充满 ajax 的网站。我把网页分成块,逐块加载,所以我需要找到改变url的方法。非常感谢
    • 我建议使用modernizr 来检查History API 支持,然后如果它不使用@pimvdb 的建议作为后备。您还可以查看 yepnope (yepnopejs.com) 以加载您的后备。
    【解决方案2】:

    URL 通常会更改为http://facebook/#!messages,因此“片段”URL 部分的更改不会使浏览器重新加载页面。相反,有一些 JavaScript 库可以监视片段更改并发出适当的请求以重新加载页面内容。

    #! 的使用几乎成为了做这些事情的“标准”,我在其他地方看到过这种用法(例如在 Twitter 上)。我不记得他们是否都使用相同的库或只是命名约定,但你应该能够在 fb/twitter 开发者页面上挖掘它。

    【讨论】:

    • 我对此并不感到困惑,它是 "facebook.com/messages" 而不是 "facebook.com/#!messages" ,我现在正在使用 facebook。它实际上是更改 url 而不是哈希。
    • 这很奇怪..我又试了一次,它转到“facebook.com/#!/messages”,带有哈希键。此外,令我惊讶的是,浏览器允许在不重新加载的情况下更改 URL页面(考虑允许这样做的安全问题..)
    • 我知道了@redshadow,因为你的浏览器不支持 html5。我尝试使用 IE8 将它更改为 www.facebook.com/#!/messages 正如你所说的那样。但不适用于 Firefox 4.0(我目前正在使用它)
    • 你说得对,我刚刚尝试使用 firefox 6,它实际上改变了你所说的 URL。我正在调查它的实际作用(我将尝试创建一个页面将其 URL 更改为 https://paypal.com/login :P)
    • 我刚刚发现了这个facebook.com/notes/facebook-engineering/…(链接自stackoverflow.com/questions/4120647/how-facebook-load-pages),这可能是开始挖掘的好点:)
    【解决方案3】:

    您可以为此查看 Content-Location HTTP 标头。请参阅here 了解更多信息。

    【讨论】:

    • @drrchknlsn 我已经尝试过使用 Content-Location,它不起作用,我还在检索内容后查看 facebook 标题,它没有内容位置。
    【解决方案4】:

    我在 JSBin.com 上编码,主要使用 CSS 和 HTML(很久以前被废弃的 Javascript)并有一个问题。例如页面的 URL 是http://www.codingrules.com/ 好吧,使用 HTML,我如何将该 URL 更改为例如 http://www.ilovecoding.com

    【讨论】:

    • 如果您有新问题,请点击 按钮提出问题。如果有助于提供上下文,请包含指向此问题的链接。
    猜你喜欢
    • 2013-06-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-03-21
    • 2023-03-17
    • 2013-10-15
    • 1970-01-01
    相关资源
    最近更新 更多