Rumah > Artikel > hujung hadapan web > Bagaimana untuk melumpuhkan butang belakang penyemak imbas anda menggunakan JavaScript?

Bagaimana untuk melumpuhkan butang belakang penyemak imbas anda menggunakan JavaScript?

王林ke hadapan: 2023-09-07 14:21:021003semak imbas

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

Maksud butang berhenti pelayar kembali adalah untuk menghalang pengguna daripada pergi ke halaman sebelumnya. Kadangkala, atas sebab keselamatan, kami perlu menghalang pengguna daripada pergi ke bahagian belakang halaman semasa.

Sebagai contoh, kebanyakan laman web bank tidak membenarkan anda kembali apabila anda menggunakan perbankan dalam talian untuk membuat transaksi tertentu dari laman web mereka. Kerana jika pengguna kembali dari pertengahan transaksi, beberapa masalah mungkin timbul. Oleh itu, ia hanya membenarkan anda melengkapkan transaksi atau membatalkannya dan memulakan semula.

Di sini, kita akan mempelajari pelbagai cara untuk menghalang pengguna daripada kembali ke halaman web sebelumnya daripada halaman web semasa menggunakan JavaScript. Dalam tutorial ini, kita akan belajar untuk menghentikan butang kembali pelayar menggunakan JavaScript atau jQuery.

Gunakan kaedah window.history.forward()

Kaedah

window.history.forward() membolehkan kami mengubah hala pengguna ke URL sebelumnya. Objek tetingkap menyimpan objek lokasi dalam format tindanan. Oleh itu, kaedah forward() bagi objek sejarah mencari lokasi terakhir dan mengubah hala pengguna ke URL objek lokasi tersebut.

Tatabahasa

Pengguna boleh menggunakan kaedah forward() bagi objek sejarah mengikut sintaks berikut.

window.history.forward();

Dalam sintaks di atas, tetingkap merujuk kepada objek global, dan setiap halaman web mengandungi objek tetingkap.

Contoh 1

Dalam contoh di bawah, kami menggunakan teg HTML 3499910bf9dac5ae3c52d5ede7383485 untuk membuat pautan yang menghantar pengguna ke halaman utama tapak TutorialsPoint. Dalam JavaScript, kami hanya menambah kaedah window.history.forward().

Kini, apabila pengguna pergi dari halaman web semasa ke halaman utama tapak tutorialsPoint, mereka tidak akan dapat kembali ke halaman tersebut.

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

Contoh 2

Dalam contoh di bawah, kami menggunakan fungsi setTimeOut() untuk mengubah hala pengguna ke halaman sebelumnya selepas masa tertentu. Dalam fungsi setTimeOut(), kami memanggil kaedah window.history.forward() selepas 1 saat.

Jadi, dalam output, pengguna boleh melihat bahawa apabila mereka kembali ke halaman semasa dari halaman utama tapak TutorialsPoint, ia mengubah hala semula selepas 1 saat.

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

Gunakan kaedah window.history.go()

Kaedah

window.history.go() mengubah hala pengguna ke URL lokasi terakhir.

Tatabahasa

Pengguna boleh menggunakan kaedah window.history.go() mengikut sintaks berikut untuk menghentikan butang belakang penyemak imbas.

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

Dalam sintaks di atas, kami menambah atribut onload pada elemen 6c04bd5ca3fcae76e30b72ad730ca86d HTML dan memanggil fungsi stopBack().

Contoh 3

Dalam contoh di bawah, kami menggunakan kaedah window.history.go() untuk mengubah hala pengguna ke halaman sebelumnya. Setiap kali halaman web dimuatkan, ia memanggil fungsi stopBack, yang mengubah hala pengguna dari halaman semasa ke halaman sebelumnya supaya kami boleh menghentikan butang belakang penyemak imbas.

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

Kami belajar cara menghalang pengguna daripada kembali ke halaman web tertentu. Kami menggunakan kaedah window.history.forward() dan window.history.go().

Atas ialah kandungan terperinci Bagaimana untuk melumpuhkan butang belakang penyemak imbas anda menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

JavaScript jquery html 栈堆对象 history

Kenyataan：

Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam

Artikel sebelumnya：Ingat untuk melindungi pelanggan anda!Artikel seterusnya：Ingat untuk melindungi pelanggan anda!

Artikel berkaitan

Lihat lagi