首页  >  文章  >  web前端  >  如何使用本地存储在 JavaScript 中的页面之间传递变量?

如何使用本地存储在 JavaScript 中的页面之间传递变量?

Mary-Kate Olsen
Mary-Kate Olsen原创
2024-10-24 07:52:011001浏览

How to Pass Variables between Pages in JavaScript using Local Storage?

通过 JavaScript 在页面之间传递变量

您的目标是将变量的值从“第 1 页”传递到“第 2 页”, " 并使用 window.onload 显示它。但是,您使用的全局变量方法似乎会导致问题。

本地存储:不同的方法

不要依赖全局变量,而是考虑使用本地存储 API。这种方法允许您将数据本地存储在浏览器中,独立于各个页面。这是使用 localStorage 的修改后的解决方案:

page1.html

<code class="html"><script>
  window.onload = function() {
    var getInput = prompt("Enter your value:");
    localStorage.setItem("myValue", getInput);
  };
</script>

...

<input type="submit" value="Go To Page 2" onclick="location.href='page2.html'"></code>

page2.html

<code class="html"><script>
  window.onload = function() {
    var getValue = localStorage.getItem("myValue");
    alert("Value from page 1: " + getValue);
  };
</script></code>

This方法避免了您遇到的全局变量问题,并允许您在两个页面之间有效地传递变量的值。

以上是如何使用本地存储在 JavaScript 中的页面之间传递变量?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn