如何在jQuery中的页面之间传递全局变量？答案

【问题标题】：How to pass a global variable between pages in jQuery?如何在jQuery中的页面之间传递全局变量？
【发布时间】：2015-05-20 15:32:43
【问题描述】：

我有一个显示课程列表的 HTML 页面 (courses.html)。这些课程通过 AJAX 调用从数据库加载到数组“课程”中，该数组定义为script_1.js 中的全局变量。一旦我进入course.html 中特定课程的页面，我希望能够将此数组传递给script_2.js 以维护课程的顺序并导航它们，而无需再次执行 AJAX 调用。

如何传递这个全局变量或如何管理它？

【问题讨论】：

标签： jquery html

【解决方案1】：

您可以通过以下选项将数据从一页传递到下一页：

Cookie. 在 page1 的 cookie 中存储一些数据。当 page2 加载时，它可以从 cookie 中读取值。
本地存储。在第 1 页的本地存储中存储一些数据。当page2加载时，它可以从Local Storage中读取值。
服务器存储。 在 page1 上代表 user1 在您的服务器上存储一些数据。当 page2 加载时，服务器可以将 user1 数据放在 page2 上，或者 page2 可以通过 ajax 从服务器请求该数据。
查询参数。 当从 page1 加载 page2 时，可以将查询参数放在 URL 上，如 http://www.example.com/page2?arg=foo 和 page2 可以在加载时从 URL 解析该查询参数.
公共父框架。如果您的页面是由一个公共来源构成的，并且您没有更改顶级 URL，而只是更改了框架 URL，那么您可以将全局数据存储在顶级父级，并且可以从框架页面访问该数据，即使它从 page1 转到 page2。

您通常可以使用 JSON 作为基于字符串的存储格式来存储更复杂的数据项，例如数组。 JSON 可以放入上述任何存储选项中。

【讨论】：

本地存储是我的保存解决方案，令人惊叹的答案！

【解决方案2】：

解决这个问题的方法是使用 cookie。

对上一个堆栈溢出问题的回答很好地解释了如何将 javascript 对象存储在 cookie 中以及如何检索它们。

https://stackoverflow.com/a/11344672/1130119

【讨论】：

【解决方案3】：

你有几个选择：

1) 如果您正在开发单页应用程序 (SPA)：创建一个全局变量来存储您的课程，例如： window.courses = []; // 填写你的数据课程

然后，当您加载第 2 页时，您可以访问 window.courses 变量

（请记住，您可以创建一个对象 app 并将所需的所有变量存储在其中：window.app = {}; window.app.courses = []）

2) 对 SPA 或经典 Web 应用很有用：将课程保存在 localStorage 上，您可以存储课程并在下一页检索（如果 localStorage.getItem('courses') 未定义，则下载）。

【讨论】：