Question

我有 page1.html ，其中包含数据集

{'key1':'value1','key2':'value2','key3':'value3'}

和一个链接

<a target='_blank' href='page2.html'>Click To Navigate</a>

将导航至 page2.html 。

我想问一下如何将page1.html中的所有数据传递给page2.html，以便我可以在page2.html中使用它们。

我尝试使用的是localStorage，但我一次只能存储1组数据，因此如果在我的page1.html中有多组数据，相同的键但值不同，则会当我将它们存储在localStorage时重叠，然后我无法将所有这些数据集传递给page2.html。

有人有个主意吗？非常感谢你

Answer 1

你可以使用Javascript来做到这一点，你可以通过哪种对象没有限制。例如，如果您有多个键值对象：

var firstData = {
    'key1' : 'value1',
    'key2' : 'value2'
};

和

var secondData = {
    'key1' : 'value3',
    'key2' : 'value4'
};

您可以使用Javascript数组将它们括起来：

// This is on page1.html
var myData = [ firstData, secondData ];

并使用localStorage传递该数组。

第1页上的Javascript

// Set the variable
localStorage.setItem( 'objectToPass', myData );

第2页上的Javascript

// Get the variable
var myData = localStorage['objectToPass'];
localStorage.removeItem( 'objectToPass' ); // Clear the localStorage
var firstData = myData[0];
var secondData = myData[1];
alert('firstData: ' + firstData + '\nsecondData: ' + secondData);

Answer 2

您可以使用带有JSON的localstorage方法（ JSON.parse ）来解析JSON字符串并构造该字符串描述的JavaScript值或对象。反向操作由另一种方法（ JSON.stringify ）完成，将JavaScript对象或值转换为JSON字符串。

第一页上的javascript：

var data = {'key1':'value1','key2':'value2','key3':'value3'};
localStorage.setItem("object_name",JSON.stringify(data));

javascript在第二页上。

var data = localStorage.getItem("object_name");
localStorage.clear(); //clean the localstorage
var value1 = JSON.parse(data).key1;
var value2 = JSON.parse(data).key2;

现在第二页中的value1和value2包含第一页中的value1和value2。

Answer 3

如果您想使用javascript执行此操作，您可以执行以下操作（解释得非常好） - https://www.boutell.com/newfaq/creating/scriptpass.html

此外，您可以使用HTML5将对象从页面传递到选择的另一个页面。为此，您可以创建一个这样的会话：

sessionStorage.setItem('key', 'value');

然后阅读会话你会这样做：

sessionStorage.getItem('key');

这是一个关于如何实现这一目标的网页上的一个很好的例子：http://demos.w3avenue.com/html5-unleashed-tips-tricks-and-techniques/sample-09-sessionstorage-demo.html

如何将数据从一个页面传递到另一个页面html

3 个答案: