Gmail在您点击邮件时使用#来区分页面(+ Ajax操作)。 http://mail.google.com/mail/#inbox/1238e709e37a1394
我发现: Google using # instead of search? in URL. Why?
在FF或Chrome中,您可以使用前进和后退,而不会在这些网址之间刷新: http://X.com/MyPage.aspx#1 http://X.com/MyPage.aspx#2 http://X.com/MyPage.aspx#3
但是在IE浏览器页面刷新时,它会在#后面进行后退操作时不计算参数。
Gmail如何让魔术发生?
答案 0 :(得分:13)
我可以给你答案,因为我已经面对并解决了这个问题。
首先要了解一些概念:
http://mail.google.com/mail#inbox
中,#inbox
是哈希部分。让我们称之为“哈希”。因此http://mail.google.com/mail
将是我们的“基本网址”。GMail跟踪历史记录主要使用基于此“哈希”的技巧来完成。
所以,还有一些概念:
因此,当您从http://mail.google.com/mail#inbox
转到http://mail.google.com/mail#sent
时,页面不会刷新。
现在,如果GMail在哈希值发生变化时收到事件通知,那么gmail可以根据它采取行动。不幸的是,没有任何DOM事件可以帮助我们捕获历史记录操作。所以相反(这是显示我如何克服问题的部分),我们运行一个无限循环来检查哈希的变化。如果它观察到更改,那么我们会检测到点击浏览器的“后退”或“前进”按钮。
在解决这个问题时,我提出了一个方便的工具:URL parser。它可以解析URL中的GET参数,以及哈希中编码的参数。试试吧!
干杯!
关于IE中的这个问题:我没有意识到这个基于'哈希'的解决方案不适用于IE(可怜的旧Linux开发人员)。
但是对于IE,您可以使用隐藏的iframe,并使用其“url affect history”属性来实现历史记录。我知道这个陈述缺乏细节,但这源于我自己缺乏IE的经验。
我会尝试这个解决方案,并跟进:)
我在互联网上找到了许多链接,使用iframes / location hash正确实现了历史记录。我没有耐心去挖掘各种浏览器上iframe接口之间的差异。
我想我更喜欢jquery plugin。 YUI也有历史经理。
干杯!
答案 1 :(得分:3)