Internet Explorer 11后退按钮Javascript行为

Question

在Chrome,FF和IE8-10中,当我按下后退按钮时,我的javascript $(document).ready()函数被调用,但在IE11中,没有调用任何javascript.有谁知道如何使IE11像所有其他浏览器一样响应并为我的代码带来一致性？

<script type="text/javascript">

    alert("Are we called?"); // neither is this called in IE11
        $( document ).ready( function() {
            alert("document ready"); // does not get fired after hitting back on IE11
        });
</script>

关于IE11的令人烦恼的问题是,如果你打开开发人员工具并开始尝试跟踪或调试问题,它会消失,它的行为与IE10一样,并在返回后调用.ready().

我通过此标题在此页面上禁用了缓存,并且它再次适用于我希望支持的所有其他浏览器(IE8-10,FF和Chrome).

Cache-Control: no-cache

Answer 1

好吧,在过去2个小时对这个问题进行冲击之后,这是我的发现.

从来没有在后退和前进之间调用以下事件:

• 负载/的onload
• 卸载/ onunload的
• 变化/平变化
• 或任何看起来可能在后退/前进时调用的其他事件

IE11缓存页面上的所有内容,包括javascript状态,因此没有触发任何常见事件.当通过后退/前进按钮在页面之间来回切换时,javascript代码只是恢复状态而不会被通知它被中断.对开发人员来说有点粗鲁或者可能有一个事件被触发,但我当然不知道.

无论如何,你可以在这个充满球的页面上看到这种行为.请注意,在IE11中,您导航到google.com然后按回,所有球都在相同的位置,一切都继续工作.在其他所有浏览器中,页面都会重新初始化,并且球再次从天花板上掉下来.我可以看到IE11行为有用且有益的场景,但我只是希望微软能够在你不希望这样的时候提供文档.此外,如果默认设置与其他所有浏览器一样并且使此功能可选而不是破坏与所有内容的所有兼容性,包括其自己的IE9和IE10,那将是很好的!

因此,我意识到,如果我启动计时器,它将从我离开的地方开始.我不喜欢这段代码,因为它是一个忙碌的等待黑客,但它做了我想要的.如果有人能想到一些不会那么繁忙的更好的东西,那就太好了......

<!-- IE11 back/forward hack - http://stackoverflow.com/questions/21274085/internet-explorer-11-back-button-javascript-behavior -->
<script type="text/javascript">
    var dumbIEHistory=history.length;
    function busyWaitCheckForHistoryChange() {
        if (history.length != dumbIEHistory) {
            alert("History has changed, back/forward has been pressed, run my function!");
            myFunction();
            dumbIEHistory=history.length;
        }
    }

// using http://www.pinlady.net/PluginDetect/Browsers/ to do browser detection
    $( window ).load(function() {
        if (browser.isIE && browser.verIE >= 11) {
            // let's not bog down all the other browsers because of IE11 stupidity
            window.setInterval("busyWaitCheckForHistoryChange()", 1000);
        } else {
            // in other browsers, this will be called when back/forward is pressed
            myFunction();
        }
    });
</script>

适用于按下后退/前进按钮时我要抓住的内容,因为在我们回击后历史长度将为+1.如果用户来回过快地导航,则在调用函数之前可能会有一瞬间,如果这是一个问题,则可以缩短间隔.希望这有助于其他人.

Answer 2

它被称为BF Cache,它自FF 1.5以来一直存在

绑定到pageshow事件并event.persisted告诉您它是否从缓存中提供.

http://msdn.microsoft.com/library/ie/dn265017(v=vs.85).aspx

https://developer.mozilla.org/en-US/docs/Using_Firefox_1.5_caching

Answer 3

我也遇到过这个问题,如果您阅读IE Doc,这显然不是一个错误.正如Robert Daly所写,请看http://msdn.microsoft.com/library/ie/dn265017(v=vs.85).aspx 您可以在此文档中找到该beforeunload事件阻止BF缓存.所以这里是一个简短的代码,它定义了在控制台上写入此事件以防止BF缓存:

if (typeof window.onbeforeunload != 'undefined'){
   function doNothing(){
      console.log('Prevent BF Cache');
   }
   window.onbeforeunload = doNothing;
}