Erkennen Sie das Schließen von Browsern oder Registerkarten

306

Gibt es einen browserübergreifenden JavaScript / jQuery-Code, der erkennt, ob der Browser oder eine Browser-Registerkarte geschlossen wird, jedoch nicht aufgrund eines geklickten Links?

Cometta
quelle
1
Siehe meine Antwort auf diese Frage: stackoverflow.com/questions/3735198/…
Nivas
Use sessionStorage Property, es läuft ab, sobald der Browser geschlossen wird. w3schools.com/jsref/prop_win_sessionstorage.asp
csandreas1
Überprüfen Sie diese Antwort! Ich fand es äußerst nützlich und decke die meisten Fälle ab. stackoverflow.com/a/26275621/7192927
SukanyaPai

Antworten:

273

Wenn ich Sie richtig verstehe, möchten Sie wissen, wann ein Tab / Fenster effektiv geschlossen wird. Nun, AFAIK der einzige Weg Javascript, um solche Dinge zu erkennen, sind onunload& onbeforeunloadEreignisse.

Leider (oder zum Glück?) Werden diese Ereignisse auch ausgelöst, wenn Sie eine Site über eine linkoder die Zurück-Schaltfläche Ihres Browsers verlassen. Das ist also die beste Antwort, die ich geben kann. Ich glaube nicht, dass Sie ein reines closeJavascript nativ erkennen können . Korrigieren Sie mich, wenn ich hier falsch liege.

jAndy
quelle
39
Richtig. Sie können nur erkennen, wann die Seite entladen wurde, nicht, wenn das Fenster geschlossen ist. Außerdem ist der Onbeforeunload nicht Standard, sodass er nicht von allen Browsern unterstützt wird.
Guffa
7
Ich wollte auch die Funktion "Schließen" verwenden, stellte jedoch fest, dass meine Benutzer den Bildschirm gelegentlich durch Drücken von F5 aktualisieren. Da meine "On Close" -Handler bei einer solchen Aktualisierung aufgerufen werden, bedeutet dies, dass ich sie nicht so verwenden kann, wie ich sie benötigt habe (was ein echter "Close Tab" oder "Fenster" war) ... verdammt, wir brauchen ein neues Ereignismodell für all das!
Jeach
1
Funktioniert nicht mehr auf Chrom / Oper ... chromestatus.com/feature/5349061406228480
Samir Seetal
2
Natürlich wird dies immer noch funktionieren, sie haben nur einen benutzerdefinierten StringRückgabewert von entfernt onbeforeunload. Jetzt können Sie vor dem Entladen keine benutzerdefinierte Nachricht mehr anzeigen.
Andy
@jAndy @Guffa Wie kann ich herausfinden, welches Fenster ausgelöst wurde unload?
Egor Dudyak
125

Aus der Firefox-Dokumentation

Aus bestimmten Gründen folgen Webkit-basierte Browser nicht den Spezifikationen für das Dialogfeld. Ein fast übergreifendes Beispiel wäre dem folgenden Beispiel sehr ähnlich.

window.addEventListener("beforeunload", function (e) {
  var confirmationMessage = "\o/";

  (e || window.event).returnValue = confirmationMessage; //Gecko + IE
  return confirmationMessage;                            //Webkit, Safari, Chrome
});

Dieses Beispiel für die Handhabung aller Browser.

mohamed-ibrahim
quelle
2
Dies ist die einzige Lösung, die für meinen Chrome-Browser funktioniert hat. Ich habe keine anderen ausprobiert.
Chase Roberts
4
Ja, ich probiere viele Lösungen aus und ich komme mit dieser Kombination, um die besten Antworten zu erhalten, und ich teste sie in allen Browsern.
Mohamed-Ibrahim
1
Diese Methode funktioniert nicht perfekt beim Schließen von Registerkarten, wenn Firefox (> = Version 44) verwendet wird und nur die Registerkarte geöffnet ist.
Rajkishore
Ab heute funktioniert die Eingabeaufforderung unter Verwendung der neuesten Browserversionen beim Schließen von Registerkarten, beim Navigieren oder Schließen des Browsers für Chrome, Firefox, Opera, IE11 und Edge sowie beim Öffnen mehrerer Registerkarten mit Ausnahme von Chrome, bei dem Chrome alle Registerkarten schließt ohne Aufforderung, zumindest auf meiner Maschine.
Thierry
keine ordnungsgemäße Ausgabe wie in der Frage definiert. Dies löste auch beim Verlassen der Seite nicht nur das Schließen des Browsers oder das Schließen des Tabs aus
Sunil Acharya,
48

Einfache Lösung

window.onbeforeunload = function () {
    return "Do you really want to close?";
};

quelle
7
Was ist das für eine Zauberei? (y) funktioniert es in allen Browsern? funktioniert gut auf Chrom
Ziv Weissman
5
Es wird ausgelöst, wenn Sie die Seite aktualisieren. Das ist mein einziges Problem.
Leo Leoncio
6
Diese Lösung funktioniert nicht mehr auf Firefox und Chrome
Mehdi Dehghani
Dies löste auch beim Verlassen der Seite nicht nur das Schließen des Browsers oder das Schließen des Tabs aus
Sunil Acharya,
20
<body onbeforeunload="ConfirmClose()" onunload="HandleOnClose()">

var myclose = false;

function ConfirmClose()
{
    if (event.clientY < 0)
    {
        event.returnValue = 'You have closed the browser. Do you want to logout from your application?';
        setTimeout('myclose=false',10);
        myclose=true;
    }
}

function HandleOnClose()
{
    if (myclose==true) 
    {
        //the url of your logout page which invalidate session on logout 
        location.replace('/contextpath/j_spring_security_logout') ;
    }   
}

// Dies funktioniert in IE7, wenn Sie einen Tab oder Browser mit nur einem Tab schließen

Jyothis
quelle
2
ya. aber für Browser mit mehreren Registerkarten wie ie8, Firefox. Gibt es ein Problem damit?
Cometta
Es stellt sich heraus, dass bei Verwendung dieses Codes in IE9 diese Meldung angezeigt wird, wenn der Benutzer mit der Maus auf die Schaltflächen Zurück, Vorwärts oder Aktualisieren klickt.
Steve Wortham
Nur ein Hinweis, dass wir 2007 eine ähnliche Lösung implementiert haben. Diese Lösung funktioniert seit etwa einer Woche nicht mehr in IE9. Es hat vor langer Zeit in Browsern mit Registerkarten aufgehört zu funktionieren (oder möglicherweise nie funktioniert).
tjfo
Ich habe die Konsole in Chromium / Ubuntu injiziert window.onunload = "alert('wait')"und window.onbeforeunload = "alert('wait... chrome!')"verwendet, aber keine ausgelöst, als ich die Registerkarte geschlossen habe.
Eiswasser
window.onunload = "alert('wait')"und so etwas sollte eigentlich nicht funktionieren. "Die Funktion sollte der returnValue-Eigenschaft des Event-Objekts einen Zeichenfolgenwert zuweisen und dieselbe Zeichenfolge zurückgeben." Bitte werfen Sie einen Blick auf MDN Artikel
Dmitry Vyprichenko
8

Ich musste den Benutzer automatisch abmelden, wenn der Browser oder die Registerkarte geschlossen wird, aber nicht, wenn der Benutzer zu anderen Links navigiert. Ich wollte auch nicht, dass eine Bestätigungsaufforderung angezeigt wird, wenn dies passiert. Nachdem ich eine Weile damit zu kämpfen hatte, insbesondere mit IE und Edge, habe ich Folgendes getan (überprüft, ob ich mit IE 11, Edge, Chrome und Firefox arbeite), nachdem ich den Ansatz anhand dieser Antwort begründet hatte .

Starten Sie zunächst einen Countdown-Timer auf dem Server in der beforeunloadEreignisbehandlungsroutine in JS. Die Ajax-Aufrufe müssen synchron sein, damit IE und Edge ordnungsgemäß funktionieren. Sie müssen auch verwenden return;, um zu verhindern, dass der Bestätigungsdialog wie folgt angezeigt wird:

    window.addEventListener("beforeunload", function (e) {        
      $.ajax({
          type: "POST",
          url: startTimerUrl,
          async: false           
      });
      return;
    });

Durch Starten des Timers wird das cancelLogoutFlag auf false gesetzt . Wenn der Benutzer die Seite aktualisiert oder zu einem anderen internen Link navigiert, wird das cancelLogoutFlag auf dem Server auf true gesetzt . Nach Ablauf des Timer-Ereignisses überprüft es das cancelLogoutFlag, um festzustellen, ob das Abmeldeereignis abgebrochen wurde. Wenn der Timer abgebrochen wurde, wird der Timer gestoppt. Wenn der Browser oder die Registerkarte geschlossen würde, cancelLogoutwürde das Flag falsch bleiben und der Ereignishandler würde den Benutzer abmelden.

Implementierungshinweis: Ich verwende ASP.NET MVC 5 und brich die Abmeldung in einer überschriebenen Controller.OnActionExecuted()Methode ab.

Ionian316
quelle
Das hat super geklappt. Gibt es einen Grund, warum Sie "async: false" machen? Dies erzeugt Warnungen, dass synchrone AJAX-Aufrufe veraltet sind. Vielen Dank!
cat_in_hat
1
@FoundWaldoException, wie in der Antwort angegeben, stellte ich fest, dass Async auf false gesetzt werden musste, damit dies in IE und Edge funktioniert.
Ionian316
Wie kann ich die Abmeldung abbrechen OnActionExecuted?
Kiquenet
@Kiquenet Stoppen Sie einfach den Timer, der in Ihrem Code gestartet wurde.
Ionian316
6

Leider konnte ich einer vorhandenen Antwort keinen Kommentar hinzufügen, aber falls Sie eine Art Warndialog implementieren möchten, wollte ich nur erwähnen, dass jede Ereignishandlerfunktion ein Argument - Ereignis hat. In Ihrem Fall können Sie event.preventDefault () aufrufen, um das automatische Verlassen der Seite zu verhindern, und dann Ihren eigenen Dialog auslösen. Ich halte dies für eine weitaus bessere Option als die Verwendung eines hässlichen und unsicheren Standardalarms (). Ich persönlich habe meine eigenen Dialogfelder basierend auf dem kendoWindow-Objekt implementiert (Teleriks Kendo-Benutzeroberfläche, die mit Ausnahme von kendoGrid und kendoEditor fast vollständig Open-Source ist). Sie können auch Dialogfelder über die jQuery-Benutzeroberfläche verwenden. Beachten Sie jedoch, dass solche Dinge asynchron sind und Sie einen Handler an das Onclick-Ereignis jeder Schaltfläche binden müssen. Dies ist jedoch recht einfach zu implementieren.

Ich stimme jedoch zu, dass das Fehlen des Real-Close-Ereignisses schrecklich ist: Wenn Sie beispielsweise Ihren Sitzungsstatus im Back-End nur im Falle des Real-Close-Ereignisses zurücksetzen möchten, ist dies ein Problem.

Alex Iurovetski
quelle
6

Bei ähnlichen Aufgaben können Sie sessionStorageDaten lokal speichern, bis die Registerkarte Browser geschlossen wird.

Das sessionStorageObjekt speichert Daten nur für eine Sitzung (die Daten werden gelöscht, wenn die Registerkarte Browser geschlossen wird). ( W3Schools )

Das ist mein Stift .

<div id="Notice">
    <span title="remove this until browser tab is closed"><u>dismiss</u>.</span>
</div>
<script>
    $("#Notice").click(function() {
     //set sessionStorage on click
        sessionStorage.setItem("dismissNotice", "Hello");
        $("#Notice").remove();
    });
    if (sessionStorage.getItem("dismissNotice"))
    //When sessionStorage is set Do stuff...
        $("#Notice").remove();
</script>
csandreas1
quelle
5

Es gibt kein Ereignis, aber es gibt eine Eigenschaft, window.closeddie zum Zeitpunkt dieses Schreibens in allen gängigen Browsern unterstützt wird. Wenn Sie also wirklich wissen müssen, können Sie das Fenster abfragen, um diese Eigenschaft zu überprüfen.

if(myWindow.closed){do things}

Hinweis: Das Abrufen von Daten ist im Allgemeinen nicht die beste Lösung. Das window.onbeforeunloadEreignis sollte nach Möglichkeit verwendet werden. Die einzige Einschränkung besteht darin, dass es auch ausgelöst wird, wenn Sie weg navigieren.

dlsso
quelle
4
$(window).unload( function () { alert("Bye now!"); } );
Poonam Bhatt
quelle
9
Dies funktioniert nicht mit Firefox oder Chrome. Versuchen Sie beforeunload, eine Warnung anzuzeigen. So:$(window).on('beforeunload', function(){ alert ('Bye now')});
AdrianoRR
5
gemäß jQuery docs "Die meisten Browser ignorieren Aufrufe von alert (), verify
katzmopolitan
4

Versuchen Sie es zu benutzen:

window.onbeforeunload = function (event) {
    var message = 'Important: Please click on \'Save\' button to leave this page.';
    if (typeof event == 'undefined') {
        event = window.event;
    }
    if (event) {
        event.returnValue = message;
    }
    return message;
};

$(function () {
    $("a").not('#lnkLogOut').click(function () {
        window.onbeforeunload = null;
    });
    $(".btn").click(function () {
        window.onbeforeunload = null;
});
});
Fezal Halai
quelle
3

Ich habe einen Weg gefunden, der auf allen meinen Browsern funktioniert .

Getestet mit folgenden Versionen: Firefox 57, Internet Explorer 11, Edge 41, eines der neuesten Chrome (meine Version wird nicht angezeigt)

Hinweis : onbeforeunload wird ausgelöst, wenn Sie die Seite auf irgendeine Weise verlassen (aktualisieren, Browser schließen, umleiten, verknüpfen, senden ..). Wenn dies nur beim Schließen des Browsers geschehen soll, binden Sie einfach die Ereignishandler.

  $(document).ready(function(){         

        var validNavigation = false;

        // Attach the event keypress to exclude the F5 refresh (includes normal refresh)
        $(document).bind('keypress', function(e) {
            if (e.keyCode == 116){
                validNavigation = true;
            }
        });

        // Attach the event click for all links in the page
        $("a").bind("click", function() {
            validNavigation = true;
        });

        // Attach the event submit for all forms in the page
        $("form").bind("submit", function() {
          validNavigation = true;
        });

        // Attach the event click for all inputs in the page
        $("input[type=submit]").bind("click", function() {
          validNavigation = true;
        }); 

        window.onbeforeunload = function() {                
            if (!validNavigation) {     
                // ------->  code comes here
            }
        };

  });
Syno
quelle
Wie ein separater Handler zum Schließen des Browsers hinzugefügt wird. Ich glaube nicht, dass wir dafür ein separates Ereignis haben.
Blazehub
Das war sehr hilfreich. Ich musste den A-Anker so einstellen, dass er nur für tatsächliche Hyperlinks ausgelöst wurde. Andernfalls hat das Klicken auf die Bootstrap-Registerkarten es vermasselt: $ ("a [href! = '']"). Not ('[href ^ = "#"]'). Bind ("click", function ()
Ken Forslund
3

Da es noch niemand erwähnt hat (8+ Jahre später): Ein WebSocket kann eine weitere effektive Möglichkeit sein, einen geschlossenen Tab zu erkennen. Solange die Registerkarte geöffnet ist und auf den Host zeigt, kann der Client eine aktive WebSocket-Verbindung zum Host aufrechterhalten.

Vorsichtsmaßnahme: Bitte beachten Sie, dass diese Lösung für ein Projekt nur dann realisierbar ist, wenn für ein WebSocket kein zusätzlicher erheblicher Aufwand erforderlich ist.

Innerhalb eines angemessenen Zeitlimits (z. B. 2 Minuten) kann die Serverseite feststellen, dass der Client nach dem Trennen des WebSocket nicht mehr verfügbar ist, und alle gewünschten Aktionen ausführen, z. B. das Entfernen hochgeladener temporärer Dateien. (In meinem äußerst speziellen Anwendungsfall bestand mein Ziel darin, einen localhost-App-Server drei Sekunden nach dem Verbindungsabbruch der WebSocket-Verbindung und dem Beenden aller CGI / FastCGI-Aktivitäten zu beenden. Alle anderen Keep-Alive-Verbindungen wirken sich nicht auf mich aus.)

Ich hatte Probleme, den Onunload-Ereignishandler dazu zu bringen, ordnungsgemäß mit Beacons zu arbeiten (wie in dieser Antwort empfohlen ). Das Schließen der Registerkarte schien das Beacon nicht auszulösen, und das Öffnen von Registerkarten löste es auf eine Weise aus, die möglicherweise Probleme verursachen könnte. Ein WebSocket löste das Problem, auf das ich stieß, sauberer, da die Verbindung ungefähr zur gleichen Zeit geschlossen wird, zu der die Registerkarte geschlossen wird und das Wechseln der Seiten innerhalb der Anwendung einfach eine neue WebSocket-Verbindung innerhalb des Verzögerungsfensters öffnet.

CubicleSoft
quelle
2
das ist in Ordnung. Aber können Sie keinen Code oder keine Prozedur freigeben, um damit umzugehen? Ohne das kann ein Noob wie ich nicht verstehen
P Satish Patro
Eigentlich war mir in meinem ersten Kommentar nicht klar. Ich kenne Web Socket nicht. Also wollte ich nur sehen, wie man damit umgeht
P Satish Patro
1
Der Link in meinem Kommentar oben führt zu einem Beispiel für einen WebSocket JS-Code. Der Client-JS-Teil ist der einfache Teil. Dieser Code ist jedoch für meinen speziellen Anwendungsfall vorgesehen, bei dem ich den gesamten Anwendungsserver rechtzeitig beenden muss. Wie Sie einen WebSocket-Server schreiben, liegt bei Ihnen und erfordert eine serverseitige Konfiguration, um alles miteinander zu verbinden (viele Leute bevorzugen ein NodeJS-Backend mit Nginx-Frontend). Das Schreiben eines TCP / IP-fähigen Servers ist ein komplexes Thema, das nicht zur Diskussion in Kommentaren geeignet ist, und es ist übertrieben, einen nur zum Erkennen dieses bestimmten Problems einzurichten.
CubicleSoft
2
//Detect Browser or Tab Close Events
$(window).on('beforeunload',function(e) {
  e = e || window.event;
  var localStorageTime = localStorage.getItem('storagetime')
  if(localStorageTime!=null && localStorageTime!=undefined){
    var currentTime = new Date().getTime(),
        timeDifference = currentTime - localStorageTime;

    if(timeDifference<25){//Browser Closed
       localStorage.removeItem('storagetime');
    }else{//Browser Tab Closed
       localStorage.setItem('storagetime',new Date().getTime());
    }

  }else{
    localStorage.setItem('storagetime',new Date().getTime());
  }
});

JSFiddle Link

Hallo zusammen, ich konnte die Klicks "Browser erkennen und Tab schließen" mithilfe des lokalen Speichers und des Zeitstempels des Browsers erzielen. Ich hoffe, Sie alle werden Ihre Probleme mit dieser Lösung lösen.

Nach meiner ersten Recherche stellte ich fest, dass der Browser beim Schließen eines Browsers alle Registerkarten nacheinander schließt, um den Browser vollständig zu schließen. Daher habe ich festgestellt, dass zwischen dem Schließen der Registerkarten nur eine sehr geringe Zeitverzögerung liegt. Daher habe ich diese Zeitverzögerung als Hauptüberprüfungspunkt verwendet und konnte die Ereigniserkennung für das Schließen von Browsern und Registerkarten erreichen.

Ich habe es auf Chrome Browser Version 76.0.3809.132 getestet und festgestellt, dass es funktioniert

:) Stimmen Sie ab, wenn Sie meine Antwort hilfreich fanden ....

Ramojuraju
quelle
Nun, das gab mir eine Idee. Ich setze einen Zeitstempel plus 10 Sekunden in localstorage nach der Anmeldung und bei einem Ereignis vor dem Entladen. Beim Laden überprüfe ich, ob die Zeit abgelaufen ist, und leite dann zur Anmeldeseite um. Danke :)
G4BB3R
1
window.onbeforeunload = function() {
  console.log('event');
  return false; //here also can be string, that will be shown to the user
}
IvanM
quelle
2
here also can be string, that will be shown to the userAuf Firefox ist dies jedoch nicht in Chrome der
Fall
Jeder Rückgabewert (Zeichenfolge) wird nur in MSIE <= 11 angezeigt. Für alle anderen Browser grundsätzlich unbrauchbar.
OSWorX
1

Es ist möglich, dies mit Hilfe von window.closed in einem Ereignishandler beim Entladen eines solchen Ereignisses zu überprüfen, es ist jedoch eine Timeout-Verwendung erforderlich (daher kann das Ergebnis nicht garantiert werden, wenn sich etwas verzögert oder das Schließen des Fensters verhindert):

Beispiel für JSFiddle (getestet auf den neuesten Versionen von Safari, FF, Chrome, Edge und IE11)

var win = window.open('', '', 'width=200,height=50,left=200,top=50');
win.document.write(`<html>
   <head><title>CHILD WINDOW/TAB</title></head>
   <body><h2>CHILD WINDOW/TAB</h2></body>
</html>`);
win.addEventListener('load',() => {
    document.querySelector('.status').innerHTML += '<p>Child was loaded!</p>';
});
win.addEventListener('unload',() => {
    document.querySelector('.status').innerHTML += '<p>Child was unloaded!</p>';
    setTimeout(()=>{
        document.querySelector('.status').innerHTML +=  getChildWindowStatus();
    },1000);
});
win.document.close()
document.querySelector('.check-child-window').onclick = ()=> {
    alert(getChildWindowStatus());
}
function getChildWindowStatus() {
  if (win.closed) { 
      return 'Child window has been closed!';
  } else {
      return 'Child window has not been closed!';
  }
}
Rvach.Flyver
quelle
1

Ich habe alle oben genannten Lösungen ausprobiert, keine davon hat wirklich für mich funktioniert, insbesondere weil es in meinem Projekt einige Telerik-Komponenten gibt, die über die Schaltfläche "Schließen" für Popup-Fenster verfügen und das Ereignis "vor dem Herunterladen" aufrufen. Außerdem funktioniert die Schaltflächenauswahl nicht ordnungsgemäß, wenn Ihre Seite ein Telerik-Raster enthält (ich meine Schaltflächen innerhalb des Rasters). Daher konnte ich keinen der oben genannten Vorschläge verwenden. Schließlich ist dies die Lösung, die für mich funktioniert hat. Ich habe ein onUnload-Ereignis zum Body-Tag von _Layout.cshtml hinzugefügt. Etwas wie das:

<body onUnload="LogOff()">

Fügen Sie dann die LogOff-Funktion hinzu, um zu Account / LogOff umzuleiten, einer in Asp.Net MVC integrierten Methode. Wenn ich jetzt den Browser oder die Registerkarte schließe, wird zur LogOff-Methode umgeleitet, und der Benutzer muss sich bei der Rückkehr anmelden. Ich habe es sowohl in Chrome als auch in Firefox getestet. Und es funktioniert!

  function LogOff() {
        $.ajax({
            url: "/Account/LogOff",
            success: function (result) {

                                        }
               });
       }
Amir978
quelle
0
window.onbeforeunload = function ()
{       

    if (isProcess > 0) 
    {
        return true;       
    }   

    else
    { 
        //do something      
    }
}; 

Diese Funktion zeigt ein Bestätigungsdialogfeld an, wenn Sie während eines Vorgangs im Browser das Fenster schließen oder die Seite aktualisieren. Diese Funktion funktioniert in allen Browsern. Sie müssen isProcess var in Ihrem Ajax-Prozess festlegen.

Hari
quelle
vollständige Probe für set isProcess?
Kiquenet
0
window.addEventListener("beforeunload", function (e) {
 var confirmationMessage = "tab close";

 (e || window.event).returnValue = confirmationMessage;     //Gecko + IE
 sendkeylog(confirmationMessage);
 return confirmationMessage;                                //Webkit, Safari, Chrome etc.
}); 
user3098847
quelle
Eigentlich wollte ich eine Bestätigungsnachricht anzeigen, wenn der Benutzer den Tab dann NUR schließt. Das funktioniert bei mir. Ich stehe jedoch vor einem Problem: Wenn ich auf einen Link auf derselben Seite klicke, wird auch die Bestätigungsmeldung angezeigt. Weitere Informationen finden Sie unter : w3schools.com/code/tryit.asp?filename=FEK2KWUN9R8Z @Tunaki
Mohammed
1
was ist sendkeylog?
Kiquenet
0

Wie @jAndy erwähnt hat, gibt es keinen richtigen Javascript-Code, um zu erkennen, dass ein Fenster geschlossen wird. Ich ging von dem aus, was @Syno vorgeschlagen hatte.

Ich habe eine solche Situation durchlaufen und vorausgesetzt, Sie befolgen diese Schritte, können Sie sie erkennen.
Ich habe es auf Chrome 67+ und Firefox 61+ getestet.

var wrapper = function () { //ignore this

var closing_window = false;
$(window).on('focus', function () {
    closing_window = false; 
   //if the user interacts with the window, then the window is not being 
   //closed
});

$(window).on('blur', function () {

    closing_window = true;
    if (!document.hidden) { //when the window is being minimized
        closing_window = false;
    }
    $(window).on('resize', function (e) { //when the window is being maximized
        closing_window = false;
    });
    $(window).off('resize'); //avoid multiple listening
});

$('html').on('mouseleave', function () {
    closing_window = true; 
    //if the user is leaving html, we have more reasons to believe that he's 
    //leaving or thinking about closing the window
});

$('html').on('mouseenter', function () {
    closing_window = false; 
    //if the user's mouse its on the page, it means you don't need to logout 
    //them, didn't it?
});

$(document).on('keydown', function (e) {

    if (e.keyCode == 91 || e.keyCode == 18) {
        closing_window = false; //shortcuts for ALT+TAB and Window key
    }

    if (e.keyCode == 116 || (e.ctrlKey && e.keyCode == 82)) {
        closing_window = false; //shortcuts for F5 and CTRL+F5 and CTRL+R
    }
});

// Prevent logout when clicking in a hiperlink
$(document).on("click", "a", function () {
    closing_window = false;
});

// Prevent logout when clicking in a button (if these buttons rediret to some page)
$(document).on("click", "button", function () {
    closing_window = false;

});
// Prevent logout when submiting
$(document).on("submit", "form", function () {
    closing_window = false;
});
// Prevent logout when submiting
$(document).on("click", "input[type=submit]", function () {
    closing_window = false;
});

var toDoWhenClosing = function() {

    //write a code here likes a user logout, example: 
    //$.ajax({
    //    url: '/MyController/MyLogOutAction',
    //    async: false,
    //    data: {

    //    },
    //    error: function () {
    //    },
    //    success: function (data) {
    //    },
    //});
};


window.onbeforeunload = function () {
    if (closing_window) {
        toDoWhenClosing();
    }
};

};

Bruno Henrique
quelle
1
Sie haben einige Probleme in Ihrem Javascript-Code. Das erste, was mir aufgefallen ist, ist, dass Sie sich ständig daran binden, resizewenn das Fenster unscharf ist. Wenn es 100x unscharf wird, haben Sie 100 Listener, was den Browser verlangsamt.
Kyle
Ich setze ein $ (Fenster) .off ('Größe ändern'), würde das ausreichen?
Bruno Henrique
Technisch gesehen werden aber auch alle anderen Handler entfernt, die an anderer Stelle über jQuery hinzugefügt wurden.
Kyle
-2

Versuchen Sie dies, ich bin sicher, dass dies für Sie funktionieren wird.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type='text/javascript'>
    $(function() {

        try{
            opera.setOverrideHistoryNavigationMode('compatible');
            history.navigationMode = 'compatible';
        }catch(e){}

        function ReturnMessage()
        {
            return "wait";
        }

        function UnBindWindow()
        {
            $(window).unbind('beforeunload', ReturnMessage);
        }

        $(window).bind('beforeunload',ReturnMessage );
    });
</script>
Tejash Raval Prajapati
quelle
-3

Versuche dies. Es wird klappen. Die jquery-Entlademethode ist veraltet.

window.onbeforeunload = function(event) {
    event.returnValue = "Write something clever here..";
};
Arda Ç.
quelle