如何在 JavaScript 中在 HTML 頁面之間傳遞具有範圍限制的變數？

在HTML 頁面之間傳遞JavaScript 變數

嘗試將變數從一個HTML 頁面（第1 頁）傳遞到另一個HTML 頁面時遇到問題另一個（第2 頁）使用JavaScript。儘管您努力聲明全域變量，但該值在第 2 頁上仍然未定義。本文旨在透過探索 JavaScript 變數的局限性並提供替代方法來提供此問題的解決方案。

理解JavaScript 變數作用域

JavaScript 變數具有特定的作用域，它決定了可以存取它們的程式碼部分。您提供的程式碼在任何函數之外聲明了一個變數價格，試圖使其成為全域變數。但是，JavaScript 只能識別在 HTML 文件開頭的腳本標記中使用 var 關鍵字全域聲明的變數。

使用 LocalStorage 進行跨頁面通訊

相反除了依賴全域變數之外，跨頁面通訊較穩健的方法是使用 LocalStorage。 LocalStorage 可讓您儲存即使重新整理頁面或關閉瀏覽器也能保留的鍵值對。

第1 頁碼：

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

第2 頁碼：

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

此方法將輸入的值儲存在第1 頁的LocalStorage 中，並在頁面載入時在第2 頁上檢索它。 LocalStorage 受到現代瀏覽器的支持，並為跨頁面通訊提供了可靠的機制。

以上是如何在 JavaScript 中在 HTML 頁面之間傳遞具有範圍限制的變數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！