Способ узнать, нажал ли пользователь "Отмена" в диалоговом окне Javascript onbeforeunload?
Я вывожу диалоговое окно, когда кто-то пытается перейти от конкретной страницы, не сохранив их работу. Я использую Javascript onbeforeunload, отлично работает.
Теперь я хочу запустить Javascript-код, когда пользователь нажимает "Отменить" в появившемся диалоговом окне (говоря, что они не хотят перемещаться от страницы).
Возможно ли это? Я также использую jQuery, так может быть событие, подобное beforeunloadcancel, с которым я могу привязываться?
ОБНОВЛЕНИЕ. Идея состоит в том, чтобы фактически сохранить и направить пользователей на другую веб-страницу, если они выбрали отмену
Ответы
Ответ 1
Вы можете сделать это следующим образом:
$(function() {
$(window).bind('beforeunload', function() {
setTimeout(function() {
setTimeout(function() {
$(document.body).css('background-color', 'red');
}, 1000);
},1);
return 'are you sure';
});
});
Код в первом методе setTimeout
имеет задержку в 1 мс. Это просто добавить функцию в UI queue
. Поскольку setTimeout
выполняется асинхронно, интерпретатор Javascript будет продолжаться, напрямую вызывая оператор return
, который, в свою очередь, запускает браузеры modal dialog
. Это заблокирует UI queue
, а код из первого setTimeout
не будет выполнен, пока модальный не будет закрыт. Если пользователь нажал кнопку "Отмена", он запустит другой setTimeout, который срабатывает примерно через одну секунду. Если пользователь подтвердил с помощью ok, пользователь будет перенаправлен, а второй setTimeout никогда не будет запущен.
example: http://www.jsfiddle.net/NdyGJ/2/
Ответ 2
Я знаю, что этот вопрос сейчас старый, но если у кого-то все еще есть проблемы с этим, я нашел решение, которое, похоже, работает для меня,
В основном событие unload
запускается после события beforeunload
. Мы можем использовать это, чтобы отменить тайм-аут, созданный в событии beforeunload
, изменяя ответ jAndy:
$(function() {
var beforeUnloadTimeout = 0 ;
$(window).bind('beforeunload', function() {
console.log('beforeunload');
beforeUnloadTimeout = setTimeout(function() {
console.log('settimeout function');
$(document.body).css('background-color', 'red');
},500);
return 'are you sure';
});
$(window).bind('unload', function() {
console.log('unload');
if(typeof beforeUnloadTimeout !=='undefined' && beforeUnloadTimeout != 0)
clearTimeout(beforeUnloadTimeout);
});
});
EDIT: jsfiddle here
Ответ 3
Я не думал, что это возможно, но просто попробовал эту идею, и она работает (хотя это хак и может не работать одинаково во всех браузерах):
window.onbeforeunload = function () {
$('body').mousemove(checkunload);
return "Sure thing";
};
function checkunload() {
$('body').unbind("mousemove");
//ADD CODE TO RUN IF CANCEL WAS CLICKED
}
Ответ 4
Невозможно. Может быть, кто-то докажет, что я ошибаюсь... Какой код вы хотите запустить? Вы хотите автоматическое сохранение при нажатии кнопки "Отмена"? Это звучит контр-интуитивно. Если вы еще не автосохранение, я думаю, что нет смысла автоматически сохранять, когда они нажимают "Отмена". Возможно, вы могли бы выделить кнопку сохранения в вашем обработчике onbeforeunload, чтобы пользователь увидел, что им нужно сделать, прежде чем перемещаться.
Ответ 5
window.onbeforeunload = function() {
if (confirm('Do you want to navigate away from this page?')) {
alert('Saving work...(OK clicked)')
} else {
alert('Saving work...(canceled clicked)')
return false
}
}
с этим кодом, также если пользователь нажмет кнопку "Отмена" в IE8, появится диалоговое окно навигации по умолчанию.