отлов перед загрузкой подтверждения отменен?

Question

Я хочу сделать что-то, когда пользователь покидает страницу, я добавляю этот код

window.onbeforunload = function (e){
   return "You save some unsaved data, Do you want to leave?";
}  

Эта подсказка может уведомить пользователя, и пользователь может остаться на странице или уйти. Но я хочу больше узнать, уходит он или нет, и действовать по своему решению. Я попробовал это,

window.onbeforunload = function (e){
   var event = jQuery.Event(e);
   var result = confirm('want to leave?');
   if (result ==  false){
     //do sth.. 
     event.preventDefault();
   }else{
    //do clean up
   }
} 

Но это не удалось !! Это всегда уходит!

Может ли какое-нибудь тело помочь мне в этом?

Answer 1

Используемый вами метод (предотвращение появления события) намеренно невозможен, в противном случае вы можете помешать пользователям покинуть вашу страницу.

Вы можете добиться чего-то похожего на то, что вы хотите, выполнив очистку onunload и делай то, что всегда хочешь делать onbeforeunload.

Answer 2

Насколько я читал об этом методе на различных форумах браузеров, таких как MSDN, MozillaDev и т. Д., Этот метод не имеет обратных вызовов для OK / Cancel.У вас есть это для диалога подтверждения, но не для этого.

Это реализация безопасности, позволяющая пользователям иметь полное право на то, какой веб-сайт они должны видеть.Кроме того, он предотвращает хакеров от блокировки пользователей на их сайтах.

Answer 3

Но я хочу больше узнать, уходит он или нет, и делать что-то по его решению

Если вы хотите что-то сделать, когда он уходит, вы можете сделать это в unloadсобытие.Например, как упомянул @Erik Bakker, вы можете отправлять асинхронные события в unload event.

Однако, если вы хотите узнать, «остался» ли пользователь, другими словами, отменил процесс выхода, есть способЧто ж.Это немного хакерски, но это работает.

const doSomethingWhenUserStays = function doSomethingWhenUserStays() {
  alert('user stayed!!!');
}


window.addEventListener('beforeunload', function onBeforeUnload(e) {
  setTimeout(doSomethingWhenUserStays, 500);
  
  // Dialog text doesn't really work in Chrome.
  const dialogText = 'A dialog text when leaving the page';
  e.returnValue = dialogText;
  return dialogText;
});

Метод doSomethingWhenUserStays будет вызываться каждый раз, но если пользователь покинет страницу, он все равно не увидит, что он выполнил.Он может выполнять асинхронный материал, синхронный, это не имеет значения, потому что он находится внутри setTimeout, поэтому он выходит за пределы обычного потока onBeforeUnload и не будет мешать ему.

Если вы хотите выполнитьТОЛЬКО если пользователь действительно остается на странице, это немного сложнее.Вам нужно установить глобальный флаг, который проверяет, достиг ли пользователь разгрузки или нет, и только затем вызывает то, что находится внутри doSomethingWhenUserStays.Рассмотрим следующий пример.

let hasUserLeft = false;

const doSomethingWhenUserStays = function doSomethingWhenUserStays() {
  // Perform the following only if user hasn't left the page
  if (!hasUserLeft) {
    alert('user stayed!!!');
  }
}


window.addEventListener('beforeunload', function onBeforeUnload(e) {
  // It won't perform doSomethingWhenUserStays in 500ms right after this is called,
  // but instead, it will perform it in 500ms after you click "Stay" or "Leave".
  // Therefore, there should be some time for `unload` handler to fire and
  // set `hasUserLeft` flag before `doSomethingWhenUserStays` is called.
  setTimeout(doSomethingWhenUserStays, 500);
  
  // Dialog text doesn't really work in Chrome.
  const dialogText = 'A dialog text when leaving the page';
  e.returnValue = dialogText;
  return dialogText;
});


window.addEventListener('unload', function onUnload() {
  hasUserLeft = true;
});