Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie deaktiviere ich die Zurück-Schaltfläche Ihres Browsers mit JavaScript?

王林
Freigeben: 2023-09-07 14:21:02
nach vorne
1028 Leute haben es durchsucht

如何使用 JavaScript 停止浏览器的后退按钮?

Die Bedeutung der Schaltfläche „Zurück im Browser stoppen“ besteht darin, zu verhindern, dass der Benutzer zur vorherigen Seite wechselt. Aus Sicherheitsgründen müssen wir manchmal verhindern, dass Benutzer zum Ende der aktuellen Seite wechseln.

Zum Beispiel erlauben die meisten Bank-Websites nicht, dass Sie zurückgehen, wenn Sie Online-Banking verwenden, um bestimmte Transaktionen über ihre Website durchzuführen. Denn wenn der Benutzer mitten in einer Transaktion zurückkehrt, können einige Probleme auftreten. Daher können Sie die Transaktion nur abschließen oder abbrechen und von vorne beginnen.

Hier erfahren Sie, wie Sie mithilfe von JavaScript verhindern können, dass Benutzer von der aktuellen Webseite zur vorherigen Webseite zurückkehren. In diesem Tutorial lernen wir, die Zurück-Schaltfläche des Browsers mithilfe von JavaScript oder jQuery zu stoppen.

Verwenden Sie die window.history.forward()-Methode

Mit der Methode

window.history.forward() können wir den Benutzer zur vorherigen URL umleiten. Fensterobjekte speichern Standortobjekte im Stapelformat. Daher findet die Methode „forward()“ des Verlaufsobjekts den letzten Standort und leitet den Benutzer zur URL dieses Standortobjekts weiter.

Grammatik

Benutzer können die Methode „forward()“ des Verlaufsobjekts gemäß der folgenden Syntax verwenden.

window.history.forward(); 
Nach dem Login kopieren

In der obigen Syntax bezieht sich „Fenster“ auf das globale Objekt und jede Webseite enthält das Fensterobjekt.

Beispiel 1

Im folgenden Beispiel verwenden wir das HTML-Tag , um einen Link zu erstellen, der den Benutzer zur Startseite der TutorialsPoint-Site weiterleitet. In JavaScript haben wir gerade die Methode window.history.forward() hinzugefügt.

Wenn Benutzer jetzt von der aktuellen Webseite zur Startseite der TutorialsPoint-Site wechseln, können sie nicht zu dieser Seite zurückkehren.

<html>
<body> 
   <h2>Preventing the browser's back button using the <i> window.history.forward() </i> method. </h2>
   <h3>Click the below link. </h3>
   <a href = "https://www.tutorialspoint.com/index.htm"> tutorialspoint</a>
   <script>
      window.history.forward();
   </script>
</body>
</html>
Nach dem Login kopieren

Beispiel 2

Im folgenden Beispiel verwenden wir die Funktion setTimeOut(), um den Benutzer nach einer bestimmten Zeit zur vorherigen Seite umzuleiten. In der Funktion setTimeOut() rufen wir nach 1 Sekunde die Methode window.history.forward() auf.

In der Ausgabe kann der Benutzer also beobachten, dass jedes Mal, wenn er von der Startseite der TutorialsPoint-Site zur aktuellen Seite zurückkehrt, diese nach 1 Sekunde erneut umgeleitet wird.

<html>
<body>
   <h2>Preventing the browser's back button using the <i> window.history.forward() </i> method. </h2>
   <h3>Click the below link. </h3>
   <a href = "https://www.tutorialspoint.com/index.htm"> tutorialspoint </a> 
   <script>
      setTimeout(() => { window.history.forward() }, 1000);
   </script>
</body>
</html>
Nach dem Login kopieren

Verwenden Sie die window.history.go()-Methode

Die Methode

window.history.go() leitet den Benutzer zur URL des letzten Standorts weiter.

Grammatik

Benutzer können die Methode window.history.go() gemäß der folgenden Syntax verwenden, um die Zurück-Schaltfläche des Browsers zu stoppen.

<body onload = "stopBack();"></body>
<script>
   function stopBack() {
      window.history.go(1);
   }
</script> 
Nach dem Login kopieren

In der obigen Syntax fügen wir das Attribut onload zum HTML-Element hinzu und rufen die Funktion stopBack() auf.

Beispiel 3

Im folgenden Beispiel verwenden wir die Methode window.history.go(), um den Benutzer zur vorherigen Seite umzuleiten. Immer wenn eine Webseite geladen wird, ruft sie die StopBack-Funktion auf, die den Benutzer von der aktuellen Seite zur vorherigen Seite umleitet, damit wir die Zurück-Schaltfläche des Browsers stoppen können.

<html>
<body onload="stopBack();">
   <h2>Preventing the browser's back button using the <i>window.history.go() </i> method.</h2>
   <h3>Click the below link. </h3>
   <a href = "https://www.tutorialspoint.com/index.htm"> tutorialspoint</a>
   <div id = "output"> </div>
   <script>
      var output = document.getElementById('output');
      function stopBack() {
         window.history.go(1);
      }
   </script>
</body>
</html>
Nach dem Login kopieren

Wir haben gelernt, wie man verhindert, dass Benutzer zu bestimmten Webseiten zurückkehren. Wir haben die Methoden window.history.forward() und window.history.go() verwendet.

Das obige ist der detaillierte Inhalt vonWie deaktiviere ich die Zurück-Schaltfläche Ihres Browsers mit JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!