将对象数组传递到另一个页面答案

【问题标题】：Passing object array to another page将对象数组传递到另一个页面
【发布时间】：2018-08-12 01:47:25
【问题描述】：

我制作了一个“结帐”按钮，当按下它时，它会将 html 表中的所有数据收集到一个对象数组中。问题是我如何将 var arrData 数据传递到下一页。 jquery 新手，在此先感谢。

$("#checkout").on('click',function(){

var arrData=[];
$("#table tr").each(function(){
    var currentRow=$(this);

    var col1_value=currentRow.find("td:eq(0)").text();
    var col2_value=currentRow.find("td:eq(1)").text();
    var col3_value=currentRow.find("td:eq(2)").text();
    var col4_value=currentRow.find("td:eq(3)").text();


    var obj={};
    obj.col1=col1_value;
    obj.col2=col2_value;
    obj.col3=col3_value;
    obj.col4=col4_value;


    arrData.push(obj);
});
console.log(arrData);

});

【问题讨论】：

无法使用 jQuery，您需要在 URL 中将 obj 作为查询参数传递，然后在其他页面中读取/解析 url
@Helpinghand 你能举个例子吗，还是很模糊。
stackoverflow.com/questions/404891/…
当您切换到另一个页面时，所有变量都会刷新。因此通过 url 是一个不错的选择。本地存储也是另一种方式
我理解了这个理论，但我如何将它应用为代码，你能为像我这样的初学者做出 1 个好的答案吗？ @Helpinghand

标签： javascript jquery html css

【解决方案1】：

为了不让事情复杂化，您可以使用localStorage 在浏览器中本地存储数据。这样您就可以随时使用您网站中任何页面的数据。

从第 1 页开始在本地存储中设置 arrData。

localStorage.myArrData=JSON.stringify(arrData);

获取第2页中arrData的值，

var arrData = JSON.parse(localStorage.myArrData);

【讨论】：

【解决方案2】：

您是否将此数据发送到后端？这段代码所做的只是将详细信息附加到对象数组中。通常，数据被传递到后端系统，随后可以在任何其他页面中从相同的页面中检索。

【讨论】：

无后端。我只想将第 1 页上的相同数据表加载到第 2 页上的另一个表中。
var arrData=[]; 可以在回调函数的范围之外定义为全局变量，您的其他数据表也可以在其中访问它。这样你就可以访问数据了。
另一个表在下一页，不是同一页。
解释为什么这是问题的答案。
您的 arrData 的范围在一个回调函数内，超出其范围是不可用的。所以它肯定不会在外面可用。因此，通过不同的页面，我相信您正在谈论包含 javascript 方法的不同 HTML 文件。据我所知，没有直接的方法。如果您正在考虑构建类似解决方案的单页应用程序，我建议您查看已经解决此问题的 Angular/React 等选项，而不是使用 jquery 构建所有内容