Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Mengekalkan Keadaan Menu pada Muat Semula Halaman menggunakan Storan Tempatan?

Bagaimana untuk Mengekalkan Keadaan Menu pada Muat Semula Halaman menggunakan Storan Tempatan?

Barbara Streisand
Barbara Streisandasal
2024-10-24 04:26:02429semak imbas

How to Maintain Menu State on Page Reload using Local Storage?

Mengekalkan Keadaan Menu pada Muat Semula Halaman

Untuk mengekalkan keadaan menu selepas muat semula halaman, pertimbangkan untuk melaksanakan fungsi storan setempat. Begini cara anda boleh menyimpan menu diterjemahkan selepas klik butang:

<code class="javascript">// Store menu item translation in local storage
$(document).on("click", "nav.pagedMenu ul li", function() {
  var translation = $(this).css('transform');
  localStorage.setItem('menuTranslation', translation);
});

// On page load, check if the menu translation is stored
$(window).on("load", function() {
  var storedTranslation = localStorage.getItem('menuTranslation');
  if (storedTranslation) {
    $("nav.pagedMenu ul li.clicked").css('transform', storedTranslation);
  }
});</code>

Kebaikan dan Keburukan Pilihan Storan

Storan Tempatan:

  • Kebaikan:

    • Pantas dan mudah dilaksanakan
    • Hanya boleh diakses oleh penyemak imbas, memastikan privasi
  • Keburukan:

    • Ruang storan terhad
    • Boleh dikosongkan oleh pengguna

Storan Sebelah Pelayan:

  • Kebaikan:

    • Ruang storan tanpa had
    • Boleh diakses daripada berbilang peranti
  • Keburukan:

    • Lebih perlahan dan lebih kompleks untuk dilaksanakan
    • Memerlukan sambungan pelayan yang boleh dipercayai

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

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn