Есть ли способ поймать событие кнопки возврата в JavaScript?

Question

Есть ли способ реагировать на нажатие кнопки «Назад» (или нажатие клавиши «Назад») в javascript, когда изменяется только хэш местоположения? То есть, когда браузер не связывается с сервером или не перезагружает страницу.

Answer 1

Используйте событие hashchange:

window.addEventListener("hashchange", function(e) {
  // ...
})

Если вам нужна поддержка старых браузеров, ознакомьтесь с разделом hashChange Событие на вики-странице Modernizr HTML5 Cross Browser Polyfills.

Answer 2

Я создал решение , которое может быть полезно некоторым людям. Просто добавьте код на свою страницу, и вы сможете написать собственную функцию, которая будет вызываться при нажатии кнопки «Назад».

Я тестировал в IE, FF, Chrome и Safari и все работает. У меня есть решение, основанное на iframes без необходимости постоянного опроса, в IE и FF, однако из-за ограничений в других браузерах в Safari используется хэш местоположения.

Answer 3

Я сделал забавный хак, чтобы решить эту проблему, к моему удовлетворению. У меня есть AJAX-сайт, который загружает содержимое динамически, затем изменяет window.location.hash, и у меня был код для запуска на $ (document) .ready (), чтобы проанализировать хэш и загрузить соответствующий раздел. Дело в том, что я был совершенно доволен кодом загрузки моего раздела для навигации, но хотел добавить способ перехвата кнопок браузера назад и вперед, которые изменяют расположение окна, но не мешают моим текущим процедурам загрузки страниц, где я манипулирую window.location и опроса window.location с постоянными интервалами не могло быть и речи.

В итоге я создал объект как таковой:

var pageload = {
    ignorehashchange: false,
    loadUrl: function(){
        if (pageload.ignorehashchange == false){
            //code to parse window.location.hash and load content
        };
    }
};

Затем я добавил строку в сценарий своего сайта, чтобы запустить функцию pageload.loadUrl для события hashchange , например:

window.addEventListener("hashchange", pageload.loadUrl, false);

Затем, в любое время, когда я хочу изменить window.location.hash без запуска этой процедуры загрузки страницы, я просто добавляю следующую строку перед каждой строкой window.location.hash =:

pageload.ignorehashchange = true;

и затем следующая строка после каждой строки модификации хеша:

setTimeout(function(){pageload.ignorehashchange = false;}, 100);

Так что теперь мои процедуры загрузки разделов обычно выполняются, но если пользователь нажимает кнопки «назад» или «вперед», новое местоположение анализируется и загружается соответствующий раздел.

Answer 4

Проверить history.js . Существует событие изменения состояния в формате HTML 5. Его можно прослушать.

Answer 5

Вы смотрели на это? http://developer.yahoo.com/yui/history/

Answer 6

onLocationChange также может быть полезным. Не уверен, что это только для Mozilla, похоже, что это может быть.