Bagaimana untuk Mengekalkan Menu dan Keadaan Halaman Selepas Muat Semula Halaman Menggunakan Storan?

Mengekalkan Keadaan Menu selepas Muat Semula Halaman

Untuk mengekalkan keadaan menu selepas muat semula halaman, anda boleh menggunakan storan setempat. Begini caranya:

1. Keadaan Menu Kedai: Gunakan LocalStorage JavaScript untuk menyimpan keadaan menu semasa, termasuk kedudukan terjemahan pautan menu yang diklik.

<code class="javascript">// Assuming you have identified the clicked menu link as `clickedLink`
localStorage.setItem('menuState', clickedLink.id);</code>

2. Dapatkan Keadaan Menu pada Muatan Halaman: Pada pemuatan halaman berikutnya, dapatkan semula keadaan menu yang disimpan daripada localStorage.

<code class="javascript">const menuState = localStorage.getItem('menuState');</code>

3. Pulihkan Keadaan Menu: Pulihkan keadaan menu dengan menetapkan kedudukan terjemahan pautan menu yang dinyatakan dalam menuState.

<code class="javascript">if (menuState) {
  const clickedLink = document.getElementById(menuState);
  clickedLink.classList.add('clicked', 'hovered');
  // Adjust translation and other styles accordingly.
}</code>

4. Kekalkan Keadaan Halaman: Jika anda ingin mengekalkan halaman semasa juga, anda boleh menyimpan nombor halaman dalam localStorage. Dapatkan semula dan pulihkannya dengan cara yang sama.

<code class="javascript">// Assuming you have a variable `currentPage` to store the current page
localStorage.setItem('pageState', currentPage);

const pageState = localStorage.getItem('pageState');
if (pageState) {
  currentPage = pageState;
  // Adjust page content and navigation state accordingly.
}</code>

5. Kosongkan Keadaan Menu: Jika mahu, anda boleh mengosongkan keadaan menu dengan mengalih keluar pembolehubah Storan setempat. Ini boleh dilakukan semasa log keluar atau navigasi ke bahagian lain tapak web.

<code class="javascript">localStorage.removeItem('menuState');
localStorage.removeItem('pageState');</code>

Kebaikan dan Keburukan Lokasi Storan

• Storan Tempatan:

  • Kebaikan:

    • Berterusan merentas sesi penyemak imbas
    • Mudah untuk digunakan

  • Keburukan:

    • Boleh diakses oleh semua skrip pada halaman
    • Kapasiti storan terhad

• Storan Sebelah Pelayan:

  • Kebaikan:

    • Lebih selamat daripada storan setempat
    • Boleh diakses daripada berbilang peranti

  • Keburukan:

    • Memerlukan persediaan dan penyelenggaraan pelayan
    • Boleh memperkenalkan kependaman dalam pemuatan dan prestasi halaman

Atas ialah kandungan terperinci Bagaimana untuk Mengekalkan Menu dan Keadaan Halaman Selepas Muat Semula Halaman Menggunakan Storan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!