Comment conserver l'état du menu lors du rechargement de la page à l'aide du stockage local ?

Maintenir l'état du menu lors du rechargement de la page

Pour préserver l'état d'un menu après le rechargement de la page, envisagez d'implémenter une fonctionnalité de stockage local. Voici comment vous pouvez conserver le menu traduit après un clic sur un bouton :

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

Avantages et inconvénients des options de stockage

Stockage local :

• Avantages :

  • Rapide et facile à mettre en œuvre
  • Accessible uniquement au navigateur, garantissant la confidentialité

• Inconvénients :

  • Espace de stockage limité
  • Peut être effacé par l'utilisateur

Stockage côté serveur :

• Avantages :

  • Espace de stockage illimité
  • Accessible depuis plusieurs appareils

• Inconvénients :

  • Plus lent et plus complexe à mettre en œuvre
  • Nécessite une connexion serveur fiable

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!