Sposób sprawdzania, czy użytkownik kliknął przycisk Anuluj w oknie dialogowym Javascript onbeforeunload?

Question

Wyświetlane jest okno dialogowe, gdy ktoś próbuje odejść od określonej strony bez zapisywania ich pracy. Używam zdarzenia onbeforeunload języka Javascript, działa świetnie.

Teraz chcę uruchomić trochę kodu JavaScript, gdy użytkownik kliknie "Anuluj" w oknie dialogowym, które się pojawi (mówiąc, że nie chce odejść od strony).

Czy to możliwe? Używam również jQuery, więc czy jest możliwe zdarzenie takie jak beforeunloadcancel, do którego mogę się podłączyć?

UPDATE: Chodzi o to, aby rzeczywiście uratować i kierują użytkowników do innej strony, jeśli wybrali anulować

Answer 1

Można to zrobić tak:

$(function() { 
    $(window).bind('beforeunload', function() { 
     setTimeout(function() { 
      setTimeout(function() { 
       $(document.body).css('background-color', 'red'); 
      }, 1000); 
     },1); 
     return 'are you sure'; 
    }); 
}); 

Kod ciągu pierwszego setTimeout metody ma opóźnienie 1ms. Jest to po prostu dodanie funkcji do UI queue. Ponieważ setTimeout działa asynchronicznie, interpreter JavaScript będzie kontynuowany przez bezpośrednie wywołanie instrukcji return, co z kolei spowoduje uruchomienie przeglądarki modal dialog. Spowoduje to zablokowanie UI queue, a kod z pierwszego setTimeout nie zostanie wykonany, dopóki modal nie zostanie zamknięty. Jeśli użytkownik naciśnie przycisk anuluj, wywoła inny setTimeout, który zostanie uruchomiony w ciągu około jednej sekundy. Jeśli użytkownik potwierdził ok, użytkownik przekieruje, a drugi setTimeout nigdy nie zostanie uruchomiony.

przykład: http://www.jsfiddle.net/NdyGJ/2/

Answer 2

niemożliwe. Może ktoś udowodni, że jestem zły ... Jaki kod chcesz uruchomić? Czy chcesz automatycznie zapisać po kliknięciu Anuluj? Brzmi to wbrew intuicji. Jeśli nie dokonałeś już autozapisu, myślę, że nie ma sensu autozapisywanie po naciśnięciu "Anuluj". Być może możesz podświetlić przycisk zapisywania w module obsługi onbeforeunload, aby użytkownik zobaczył, co powinien zrobić przed nawigacją.

Answer 3

Nie sądziłem, że to możliwe, ale tylko próbował ten pomysł i działa (choć niektórzy co hack i nie może działać tak samo we wszystkich przeglądarkach):

window.onbeforeunload = function() { 
    $('body').mousemove(checkunload); 
    return "Sure thing"; 
}; 

function checkunload() { 
    $('body').unbind("mousemove"); 
    //ADD CODE TO RUN IF CANCEL WAS CLICKED 
} 

Answer 4

wiem, że to pytanie jest już stary, ale w przypadku gdy ktoś jest nadal występują problemy z tym, znalazłem rozwiązanie, które wydaje się działać dla mnie,

Zasadniczo zdarzenie unload jest zwolniony po beforeunload e kratka wentylacyjna. Możemy to wykorzystać, aby anulować timeout utworzony w przypadku beforeunload, modyfikując JANDY za odpowiedź:

$(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

Answer 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 
    } 
} 

z tego kodu również, jeśli użytkownik kliknie przycisk 'Anuluj' w IE8 pojawi się domyślne okno dialogowe nawigacji.