Wie reagiert man auf Unterereignisse von onbeforeunload?

Ich bemerkte, dass das Ereignis onbeforeunload in der Lage ist, zwischen verschiedenen Benutzeraktionen zu unterscheiden, z. ob der Benutzer auf einen Link auf der Seite drückte, der Benutzer versuchte, die Seite zu schließen, der Benutzer wollte eine Seite zurückgehen etc.Wie reagiert man auf Unterereignisse von onbeforeunload?

Zum Beispiel, wenn ein Benutzer auf einen Link klickt, dann ein Bestätigungsfeld mit dem Text "Sind Sie sicher, dass Sie die Seite schließen möchten?" fragt, aber wenn der Benutzer F5 drückt, um die Seite zu aktualisieren, dann ist der Text des Feldes "Sind Sie sicher, dass Sie die Seite aktualisieren möchten?" .

Ist es möglich, die verschiedenen Unterereignisse von onbeforeunload zu unterscheiden und darauf zu reagieren?

Ich versuche, die Hintergrundfarbe meiner Seite zu rot zu ändern, wenn der Benutzer versucht, die Seite zu verlassen, und zu orange, wenn er versucht, die Seite zu aktualisieren, das ist nur eine einfache Testaktion für besseres Verständnis.

HINWEIS: Ich übersetzte den Text von der Eingabeaufforderung von Deutsch nach Englisch, so dass der Text anders sein könnte.

SEITENFRAGE: Warum erscheint das Bestätigungsfeld zweimal, wenn ich auf den Link klicke und auf "Leave page" drücke, wenn ich diesen Code auf meinem lokalen Webserver ausführe, aber nicht auf stackoverflow?

function ask() 
 
{ 
 
    return "Are you sure?"; 
 
    
 
    //How can i find out what the user actually tried? 
 
    //e.g. did he tried to refresh the page? Or did he tried to close it? 
 
    //PSEUDO CODE: 
 
    // if (user_tried_reload) { alert("RELOAD"); } 
 
    // else if (user_tried_close) { alert ("CLOSE"); } 
 
}

<body onbeforeunload="return ask()"> 
 
    <h1>onbeforeunload Test</h1> 
 
    <a href="http://www.google.de">Google</a> 
 
</body>

USAGE: Drücken Sie auf "Run-Code-Snippet" und dann, ob auf den Link klicken oder versuchen, die Seite zu aktualisieren.

Quelle

2016-04-08 Black

Der Grund, warum der Code zweimal ausgelöst wird, ist, weil der Button "Leave Page" das Entladeereignis erneut auslöst.

Was ich schlage vor, Sie tun, ist das F5-Tastendruckereignis fangen und Ihre eigene Mitteilung tun:

document.onkeydown = function(evt) { 
    evt = evt || window.event; 
    if (evt.keyCode == 116) { 
     ask('reload'); 
    } 
};

In Ihrer fragen() Funktion, würde ich so etwas wie diese:

var howmanytimes = 0; 
function ask(action) 
{ 
    howmanytimes++; 

    //PSEUDO CODE: 
    if (howmanytimes == 1) { 
    if (action == 'reload') { alert("RELOAD"); } 
    else { alert ("CLOSE"); } 
    } else { howmanytimes == 0 }; 
}

Dieser Code ist ungetestet und ich habe keinen Zugriff auf jsfiddle von wo ich bin, hoffe, dass dies Sie in die richtige Richtung weist (und dass ich die Frage richtig verstanden habe!)

Quelle

2016-04-08 08:11:42 zerohero

Seite kann durch Klicken auf aktualisiert werden t Er aktualisiert das Icon im Browser, Strg + R, F5 –

Thx. Wenn der Benutzer jedoch die Schaltfläche zum erneuten Laden im Browser drückt, wird er weiterhin als SCHLIESSEN erkannt. – Black

Wenn Sie F5 abfangen (und sich Strg + R merken), überprüfen Sie event.ClientY ist <0 (Schließen-Schaltfläche) und nicht nur geschlossen. dann wissen Sie, dass die Aktualisierung angeklickt wurde. Macht Sinn? – zerohero

Wie reagiert man auf Unterereignisse von onbeforeunload?

Antwort

Verwandte Themen