Internet Explorer 11 Back Button Javascript Behavior

В 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

Ответы

Ответ 1

Хорошо, после того, как я ударил по проблеме последние 2 часа, вот мои выводы.

Следующие события никогда не вызываются между назад и вперед:

IE11 кэширует все на странице, включая состояние javascript, поэтому ни одно из обычных событий не запускается. При переходе между страницами с помощью кнопок "назад/вперед" код javascript просто возобновляет состояние без уведомления о том, что он был прерван. Сорта грубая для разработчиков imho или, возможно, для этого запускается событие, но я, конечно, не знаю об этом.

В любом случае вы можете увидеть это поведение на этой странице, наполненной шарами. Обратите внимание, что в IE11 вы переходите на google.com, а затем отжимаете назад, все шары находятся в одном и том же месте, и все продолжает работать. В каждом другом браузере страница повторно инициализируется, и шары снова падают с потолка. Я вижу сценарии, в которых поведение IE11 было бы полезным и полезным, но я просто хочу, чтобы Microsoft предоставила документацию, когда вы этого не хотите. Кроме того, было бы неплохо, если бы значения по умолчанию были бы похожими на любой другой браузер и добавили бы эту функцию вместо того, чтобы нарушать всю совместимость со всем, включая свои 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 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 после того, как мы ударим. Если пользователь слишком быстро перемещается вперед и назад, может потребоваться секундная секция перед вызовом функции, если это вызывает беспокойство, вы можете уменьшить интервал. Надеюсь, это поможет другим.

Ответ 3

Я также столкнулся с этой проблемой, что явно не является ошибкой, если вы читаете IE Doc. Как писал Роберт Дейли, взгляните на 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;
}

Ответ 4

вы можете использовать window.onhashchange для отслеживания поведения кнопок "назад/вперед".

var isInited = false;

function init() {
    if (isInited) {
        return;
    }
    isInited = true;

    ...
}

$(document).ready(init);

window.onhashchange = function() {
    $(document).ready(init);
};

Ответ 5

Я был так же раздражен этой проблемой. Почему IE так расстраивает?

Я обнаружил, что настройка Cache-Control: no-cache в файле HTML не помогла. То, что помогло, было фактически установить это в заголовке ответа.

В моем случае я рисую диаграмму Google, и мне нужно, чтобы она перерисовывалась всякий раз, когда я посещаю страницу (IE11 даже предотвращал перерисовку моей диаграммы, когда я обновлял страницу вручную!).

Я использую ASP.NET MVC, и этот код в моем методе действий решает проблему.

Response.CacheControl = "no-cache";

Надеюсь, что это поможет.