2

不太清楚该怎么称呼它,但这是我的抽象问题:

往复时,为什么有些浏览器不记得打开了什么而有些会?

例如,

鉴于以下情况:

html

<h2>&raquo; <a href="#" id="clickMe">Click Me</a></h2>
<div id="hiddenContent">
    <h2> Meaty Filler </h2>
    <p>
       Bacon ipsum dolor sit amet deserunt venison dolor meatball laboris short loin dolore capicola prosciutto. Tongue cillum salami, drumstick strip steak do spare ribs ball tip proident short loin ullamco ex tempor. Fugiat labore in ut quis ribeye turducken pig beef. Corned beef ham proident, nisi adipisicing bresaola irure kielbasa pig. T-bone nisi ham hock consequat laborum est exercitation dolor shoulder biltong velit qui sunt. Ut chuck esse short ribs turducken, pork loin id.
    </p>
    <p>
Nulla sunt aute meatloaf drumstick pork. Drumstick deserunt capicola aliqua flank leberkas brisket consectetur. Pork belly meatloaf proident, deserunt tri-tip voluptate aliqua. Commodo minim consequat, shoulder tenderloin eiusmod laborum excepteur flank reprehenderit in.
    </p>
   &raquo; <a href="http://baconipsum.com/">  Get Me Some Bacon</a>
</div>
        ​

javascript/jquery

$('#clickMe').click(function(e) { 
   e.preventDefault();
   $('#hiddenContent').fadeToggle();        
})​

css

#hiddenContent {display: none; border: 1px solid #ccc; background: #fcfcfc; padding: 1em; margin: 2em; border-radius: .25em; box-shadow: 2px 5px 10px #DBDBDB;} 

#hiddenContent:hover { background: #FBFBFB; } 
h2 { font: 1.5em/1.75em Georgia, serif; } 
p { margin: 0 0 1em; font: 1em/1.25em Georgia, serif; text-align: justify; } 
a { color: #444; text-decoration: none;} 
a:hover { text-decoration: underline; color: #222; }​

当我点击“给我一些培根”并点击后退按钮时,铬和 IE8 将不记得它#hiddenContent是打开的,不再隐藏,但 Firefox 会。理想情况下,我更愿意模仿 firefox 的行为,但不确定我是否能够。这可能吗?

这是一个不工作的jsfiddle。当您回击时,jsfiddle 会显式重新加载页面,但在我的(基于 struts - java 的)Web 应用程序中,我已将响应设置为显式缓存。

4

2 回答 2

1

因此,听起来您希望浏览器在您返回页面加载后记住页面上的更改。Firefox 的页面缓存在某些情况下确实如此,但在其他浏览器中您不能指望它。

我认为您想要做的是在取消隐藏内容时更新 URL 哈希(或片段)。这将在浏览器的历史记录中添加一个新条目。

然后在同一页面上,您要检查页面加载时的哈希以确定是否显示隐藏内容。

$('#clickMe').click(function(e) { 
    e.preventDefault();
    window.location.hash = 'show'
    $('#hiddenContent').fadeToggle();        
})​

并添加这个

$(document).ready(function() {
    if(window.location.hash == 'show')
        $('#hiddenContent').show();
});

然后,当您回击时,#show 将出现在 URL 中。准备就绪后,您可以检查该值并显示内容。

于 2012-12-06T00:45:13.943 回答
0

看起来这可能是不可能的(或者至少以一种始终可以保证工作的方式),因为它是依赖于浏览器的行为。Chromium 和 IE 中可能有一些设置可以用来模仿 Firefox 的行为,但这些设置是浏览器用户的域,因此在很大程度上不受您的控制。

还要看看这个相关的问题:浏览器中的后退/前进是否会更改 javascript 变量?

于 2012-12-05T23:29:34.340 回答