Обнаружение кнопки возврата в браузере
Мне нужно определить, нажала ли пользователь кнопку "Назад" или нет.
Для этого я использую
window.onbeforeunload = function (e) {
}
Он работает, если пользователь нажимает кнопку "Назад". Но это событие также запускается, если пользователь нажимает F5
или перезагрузить браузер. Как это исправить?
Ответы
Ответ 1
Итак, что касается AJAX...
Отключение при использовании большинства веб-приложений, использующих AJAX для навигации по определенным частям страницы, является ОГРОМНОЙ проблемой. Я не согласен с тем, что "отключить кнопку означает, что вы делаете что-то не так", и на самом деле разработчики в разных аспектах давно столкнулись с этой проблемой. Здесь мое решение:
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;
}
};
}
}
Насколько я мог сказать, что это работает через хром, firefox, еще не протестировал IE.
Ответ 2
Попробуйте это (если браузер не поддерживает "onbeforeunload" ):
jQuery(document).ready(function($) {
if (window.history && window.history.pushState) {
$(window).on('popstate', function() {
var hashLocation = location.hash;
var hashSplit = hashLocation.split("#!/");
var hashName = hashSplit[1];
if (hashName !== '') {
var hash = window.location.hash;
if (hash === '') {
alert('Back button was pressed.');
}
}
});
window.history.pushState('forward', null, './#forward');
}
});
Ответ 3
Лучший способ, который я знаю
window.onbeforeunload = function (e) {
var e = e || window.event;
var msg = "Do you really want to leave this page?"
// For IE and Firefox
if (e) {
e.returnValue = msg;
}
// For Safari / chrome
return msg;
};
Ответ 4
Так как кнопка "Назад" является функцией браузера, может быть сложно изменить функциональность по умолчанию. Однако есть некоторые проблемы. Взгляните на эту статью:
http://www.irt.org/script/311.htm
Как правило, необходимость отключения кнопки "назад" является хорошим индикатором проблемы/недостатка программирования. Я хотел бы найти альтернативный метод, например, установить переменную сеанса или файл cookie, который сохраняет, была ли форма уже отправлена.
Ответ 5
Я предполагаю, что вы пытаетесь справиться с навигацией Ajax и не пытаетесь помешать своим пользователям использовать кнопку "Назад", которая нарушает практически все принципы разработки пользовательского интерфейса.
Вот некоторые возможные решения:
История JQuery
Salajax
Лучшая кнопка Ajax Back
Ответ 6
Я обнаруживаю кнопку "назад" следующим образом:
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.
};
}
Это работает, но я должен создать файл cookie в Chrome, чтобы обнаружить, что я впервые попал на страницу, потому что, когда я вхожу на страницу без контроля с помощью cookie, браузер делает обратное действие без щелчка на любой кнопке.
if (typeof history.pushState === "function"){
history.pushState("jibberish", null, null);
window.onpopstate = function () {
if ( ((x=usera.indexOf("Chrome"))!=-1) && readCookie('cookieChrome')==null )
{
addCookie('cookieChrome',1, 1440);
}
else
{
history.pushState('newjibberish', null, null);
}
};
}
И ОЧЕНЬ ВАЖНО, history.pushState("jibberish", null, null);
дублирует историю браузера.
Кто-нибудь знает, кто может это исправить?