Comment transmettre des variables entre des pages HTML en JavaScript avec des limitations de portée ?

Passer des variables en JavaScript entre des pages HTML

Vous rencontrez un problème lorsque vous tentez de transmettre une variable d'une page HTML (page 1) à un autre (page 2) en utilisant JavaScript. Malgré vos efforts pour déclarer une variable globale, la valeur reste indéfinie page 2. Cet article vise à apporter une solution à ce problème en explorant les limites des variables JavaScript et en proposant une approche alternative.

Comprendre Portée des variables JavaScript

Les variables JavaScript ont une portée spécifique, qui détermine les parties du code où elles sont accessibles. Le code que vous avez fourni déclare un prix variable en dehors de toute fonction, en essayant de le rendre global. Cependant, JavaScript ne reconnaît que les variables déclarées globalement avec le mot-clé var dans les balises de script au début du document HTML.

Utiliser LocalStorage pour la communication entre pages

À la place Au lieu de s'appuyer sur des variables globales, une approche plus robuste pour la communication entre pages consiste à utiliser LocalStorage. LocalStorage vous permet de stocker des paires clé-valeur qui persistent même lorsque la page est actualisée ou que le navigateur est fermé.

Code de la page 1 :

<code class="html"><script type="text/javascript">
window.onload = function() {
   var getInput = prompt("Hey type something here: ");
   localStorage.setItem("storedPrice", getInput);
}
</script></code>

Code page 2 :

<code class="html"><script type="text/javascript">
window.onload = function() {
   alert(localStorage.getItem("storedPrice"));
}
</script></code>

Cette approche stocke la valeur saisie dans LocalStorage sur la page 1 et la récupère sur la page 2 lors du chargement de la page. LocalStorage est pris en charge par les navigateurs modernes et fournit un mécanisme fiable pour la communication entre pages.

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!