


Wie erkennt man den Klick des Benutzers auf die Zurück-Schaltfläche in Browsern, ohne dass es zu Störungen beim Neuladen des Browsers kommt?
Oct 22, 2024 pm 02:41 PMKlicken des Benutzers auf die Zurück-Schaltfläche in Browsern erkennen
Beim Versuch, Klicks auf die Zurück-Schaltfläche zu erkennen, verlassen sich Entwickler häufig auf den Ereignis-Listener window.onbeforeunload. Dieses Ereignis wird jedoch nicht nur bei Klicks auf die Zurück-Schaltfläche ausgelöst, sondern auch beim Neuladen des Browsers, was irreführend sein kann.
Erkennen von Klicks auf die Zurück-Schaltfläche ohne Beeinträchtigung des Browser-Neuladens
Umzugehen Klicken Sie auf die Zurück-Schaltfläche ohne Fehlalarme. Erwägen Sie die Verwendung eines maßgeschneiderten Ansatzes:
-
Verlaufsänderung:
- Überprüfen Sie beim Laden der Seite, ob die Die API „history.pushState“ ist verfügbar.
- Falls unterstützt, können Sie mithilfe von „history.pushState“ einen zufälligen Status in den Verlauf übertragen.
- Definieren Sie einen Onpopstate-Ereignis-Listener, um Übergänge von Schaltflächen „Vorwärts“ und „Vorwärts“ zu verarbeiten.
-
Hash-basierter Ansatz:
- Wenn History.pushState nicht unterstützt wird, verwenden Sie das Hash-Änderungsereignis (window.onhashchange). .
- Legen Sie einen anfänglichen Hash-Wert fest und prüfen Sie bei Hash-Änderungen, ob ein nicht zufälliger Hash-Wert vorliegt.
- Verwenden Sie ein Flag, um sicherzustellen, dass nur vom Benutzer initiierte Hash-Änderungen die Logik der Zurück-Schaltfläche auslösen. Das Neuladen des Browsers wird ignoriert.
Implementierung
<code class="javascript">window.onload = function () { if (typeof history.pushState === "function") { history.pushState("jibberish", null, null); window.onpopstate = function () { history.pushState('newjibberish', null, null); // Handle back button click here }; } else { var ignoreHashChange = true; window.onhashchange = function () { if (!ignoreHashChange) { ignoreHashChange = true; window.location.hash = Math.random(); // Handle back button click here } else { ignoreHashChange = false; } }; } }</code>
Kompatibilität
Dieser Ansatz Es wurde berichtet, dass es in Chrome und Firefox effektiv funktioniert.
Das obige ist der detaillierte Inhalt vonWie erkennt man den Klick des Benutzers auf die Zurück-Schaltfläche in Browsern, ohne dass es zu Störungen beim Neuladen des Browsers kommt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heißer Artikel

Hot-Tools-Tags

Heißer Artikel

Heiße Artikel -Tags

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Ersetzen Sie Stringzeichen in JavaScript

Benutzerdefinierte Google -Search -API -Setup -Tutorial

8 atemberaubende JQuery -Seiten -Layout -Plugins

Erstellen Sie Ihre eigenen AJAX -Webanwendungen

10 JavaScript & JQuery MVC -Tutorials
