Bagaimana untuk Mengesan Klik Butang Belakang Pengguna dalam Penyemak Imbas Tanpa Gangguan Muat Semula Penyemak Imbas?

Kesan Klik Butang Belakang Pengguna dalam Penyemak Imbas

Apabila cuba mengesan klik butang kembali, pembangun sering bergantung pada pendengar acara window.onbeforeunload. Walau bagaimanapun, peristiwa ini mencetuskan bukan sahaja untuk klik butang belakang tetapi juga untuk muat semula penyemak imbas, yang boleh mengelirukan.

Mengesan Klik Butang Belakang tanpa Gangguan Muat Semula Penyemak Imbas

Untuk mengendalikan klik butang belakang tanpa positif palsu, pertimbangkan untuk menggunakan pendekatan yang disesuaikan:

1. Pengubahsuaian Sejarah:

   • Setelah dimuatkan halaman, semak sama ada history.pushState API tersedia.
   • Jika disokong, tolak keadaan rawak ke dalam sejarah menggunakan history.pushState.
   • Tentukan pendengar acara onpopstate untuk mengendalikan peralihan butang ke belakang dan ke hadapan.

2. Pendekatan Berasaskan Hash:

   • Jika history.pushState tidak disokong, gunakan acara perubahan cincang (window.onhashchange) .
   • Tetapkan nilai cincang awal dan selepas perubahan cincang, semak nilai cincang bukan rawak.
   • Gunakan bendera untuk memastikan hanya perubahan cincang yang dimulakan pengguna mencetuskan logik butang belakang, mengabaikan muat semula penyemak imbas.

Pelaksanaan

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

Keserasian

Pendekatan ini telah dilaporkan berfungsi dengan berkesan dalam Chrome dan Firefox.

Atas ialah kandungan terperinci Bagaimana untuk Mengesan Klik Butang Belakang Pengguna dalam Penyemak Imbas Tanpa Gangguan Muat Semula Penyemak Imbas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!