Javascript / jQuery обнаруживает изменение хеша только при нажатии кнопки браузера назад / вперед

Question

Можно ли обнаружить изменение хеша только при изменении истории браузера (т. Е. Кнопка Назад или Вперед)?

Я видел событие onBeforeUnload, но это событие не срабатывает при изменении хеша, так как окноне выгружается.

Событие hashchange явно срабатывает каждый раз, когда изменяется хэш.Любое исправление?Желательно без плагина.Я видел плагин истории jQuery, но ищу простейшее решение.

Спасибо за помощь.

Answer 1

Я заканчивал тем, что отмечал флаг всякий раз, когда моя навигация была вызвана, и если флаг был отмечен, событие hashChange проигнорировало бы его, иначе это обработало бы это, как если бы это было событие назад / вперед.

Answer 2

Посмотрите на событие window.onhashchange .

В настоящее время он поддерживается не во всех браузерах. Взгляните на плагин BA jQuery Hash Change здесь . Это может сработать, если вы решите использовать плагин в конце.

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

Answer 3

Я думаю, что Крис попросил, чтобы событие window.onhashchange работало только тогда, когда вы перемещаетесь по кнопкам истории браузера (назад / вперед).

Ответ = Нет ... но вы можете поставить if в функцию.
Я бы сделал это:

$('.nav').click(function() {    //on the onclick event for your nav add a class
  $(this).addClass('navClick'); // before you change the hash.
  window.location.hash = 'state' + $(this).html();
});
function getLocationHash() {
  return window.location.hash.substring(1);
}
window.onhashchange = function(e) { // if element does not exist with your
  if ($('.navClick').length == 0) { // 'navClick' class then check hash
    switch(getLocationHash()) {
      case 'state1': 
        execute code block 1;
        break;
      case 'state2':
        execute code block 2;
        break;
      default: 
        code to be executed if different from case 1 and 2;
    }
  } else {                         // removes the class if it does
    $('.navClick').removeClass('navClick');
  }
};

Я сделал нечто подобное на моем сайте

Это все динамически меняющийся контент. Я все еще использую window.location.hash для отслеживания состояний сайта. Если вы перемещаетесь по сайту, а затем начинаете использовать кнопки «Назад», чтобы перемещаться после того, как сайт вошел в историю, он будет динамически менять состояния, как если бы пользователь действительно нажимал навигацию, а не нуждался в перезагрузке страницы после этого. Он проверяет хеш, только если вы используете историю для навигации.

Answer 4

У меня есть рекомендация для другого подхода.Допустим, у вас есть ссылка, которая ведет на какую-то страницу (но использует AJAX без обновления).При щелчке по этой ссылке вы меняете хеш на что угодно.Теперь, когда пользователь нажимает кнопку «Назад», хэш возвращается к тому, что было изначально до того, как пользователь нажал на ссылку ... но вы могли бы проверить, было ли инициировано событие щелчка по ссылке или кнопке (или как угодноселектор / событие, которое вы хотите проверить).Если он был запущен, вы знаете, что запрос пришел от клика на самой странице.Если не было событий, которые вы проверяете, вы знаете, что щелчок произошел с помощью кнопки «назад» или «вперед».

Еще одна вещь, которую вы можете сделать, это добавить суффикс к хешу при его изменении (с помощью кнопки «назад» или «вперед» на основе проверки любых событий).Таким образом, если бы у вас был хэш #pageTitle, вы бы превратили его в #pageTitle_chrome, чтобы указать, что хеш был изменен с кнопки «назад» или «вперед».

Затем, когда вы проверяете свои хэши, выможно было просто увидеть, содержит ли он _chrome, чтобы определить, какое это было изменение хеша.

Answer 5

Вы не можете сделать это с помощью хэшей или даже с API истории HTML5.Нет событий, связанных исключительно с нажатием кнопки «назад» или «вперед».Вероятно, вам нужен другой подход к исходной проблеме, если только выполнимо установить какие-либо расширения или такие на клиентском компьютере.