Подтвердить что ты не робот

JavaScript или jQuery.

Может ли кто-нибудь поделиться опытом/кодом, как мы можем обнаружить щелчок на кнопке браузера (для любого типа браузеров)?

Нам нужно обслуживать весь браузер, который не поддерживает HTML5

4b9b3361

ОТВЕТЫ

Ответ 1

Событие "popstate" работает только тогда, когда вы что-то нажимаете. Поэтому вам нужно сделать что-то вроде этого:

jQuery(document).ready(function($) {

  if (window.history && window.history.pushState) {

    window.history.pushState('forward', null, './#forward');

    $(window).on('popstate', function() {
      alert('Back button was pressed.');
    });

  }
});

Для обратной совместимости браузера я рекомендую: history.js

Ответ 2

существует множество способов, как вы можете определить, нажал ли пользователь кнопку "Назад" . Но все зависит от ваших потребностей. Попробуйте изучить ссылки ниже, они должны вам помочь.

Обнаружение, если пользователь нажал кнопку "Назад" на текущей странице:

Определите, просматривается ли текущая страница после нажатия кнопки "Назад" на предыдущей странице ( "Переслать" ):

Ответ 3

Нашел это, чтобы работать хорошо кросс-браузер и мобильный back_button_override.js.

(Добавлен таймер для сафари 5.0)

// managage back button click (and backspace)
var count = 0; // needed for safari
window.onload = function () { 
    if (typeof history.pushState === "function") { 
        history.pushState("back", null, null);          
        window.onpopstate = function () { 
            history.pushState('back', null, null);              
            if(count == 1){window.location = 'your url';}
         }; 
     }
 }  
setTimeout(function(){count = 1;},200);

Ответ 4

В javascript тип навигации 2 означает, что браузер нажимает кнопку "назад" или "вперед", и браузер фактически берет контент из кэша.

if(performance.navigation.type == 2) {
    //Do your code here
}

Ответ 5

Вы можете использовать этот удивительный плагин

https://github.com/ianrogren/jquery-backDetect

Все, что вам нужно сделать, это написать этот код

  $(window).load(function(){
    $('body').backDetect(function(){
      // Callback function
      alert("Look forward to the future, not the past!");
    });
  });

Лучший

Ответ 6

Он доступен в API истории HTML5. Событие называется 'popstate'

Ответ 7

Отключите кнопку URL, выполнив следующую функцию:

window.onload = function () {
    if (typeof history.pushState === "function") {
        history.pushState("jibberish", null, null);
        window.onpopstate = function () {
            history.pushState('newjibberish', null, null);
            // Handle the back (or forward) buttons here
            // Will NOT handle refresh, use onbeforeunload for this.
        };
    }
    else {
        var ignoreHashChange = true;
        window.onhashchange = function () {
            if (!ignoreHashChange) {
                ignoreHashChange = true;
                window.location.hash = Math.random();
                // Detect and redirect change here
                // Works in older FF and IE9
                // * it does mess with your hash symbol (anchor?) pound sign
                // delimiter on the end of the URL
            }
            else {
                ignoreHashChange = false;
            }
        };
    }
};

Ответ 8

В моем случае я использую jQuery .load() для обновления DIV в SPA (одностраничное [веб-приложение]).

Будучи новым для работы с прослушивателем событий $(window).on('hashchange', ..), этот оказался сложным и немного взломал. Благодаря чтению большого количества ответов и попытке различных вариантов, наконец выяснилось, как заставить его работать следующим образом. Насколько я могу судить, он пока выглядит стабильным.

В заключение - существует переменная globalCurrentHash, которая должна быть установлена ​​каждый раз при загрузке представления.

Затем, когда запускается $(window).on('hashchange', ..) прослушиватель событий, он проверяет следующее:

  • Если location.hash имеет одно и то же значение, это означает Going Forward
  • Если location.hash имеет другое значение, это означает Going Back

Я понимаю, что использование глобальных vars - не самое изящное решение, но делать вещи OO в JS кажутся мне сложными до сих пор. Предложения по улучшению/уточнению, безусловно, оценены

Настройка:

  • Определите глобальный var:
    var globalCurrentHash = null;

  1. При вызове .load() для обновления DIV обновите также глобальный var:

    function loadMenuSelection(hrefVal) {
  $('#layout_main').load(nextView);
  globalCurrentHash = hrefVal;
}

  2. На странице ready настройте прослушиватель, чтобы проверить глобальный var, чтобы увидеть, нажата ли кнопка "Назад":

    $(document).ready(function(){
  $(window).on('hashchange', function(){
      console.log( 'location.hash: ' + location.hash );
      console.log( 'globalCurrentHash: ' + globalCurrentHash );

      if (location.hash == globalCurrentHash) {
          console.log( 'Going fwd' );
      }
      else {

          console.log( 'Going Back' );
          loadMenuSelection(location.hash);
      }
    });

});

Ответ 9

В случае HTML5 это сделает трюк

window.onpopstate = function() {
   alert("clicked back button");
}; history.pushState({}, '');

Ответ 10

Предположим, у вас есть кнопка:

<button onclick="backBtn();">Back...</button>

Вот код метода backBtn:

  function backBtn(){
                    parent.history.back();
                    return false;
                }