在html页面之间共享数据

时间:2012-07-23 09:01:53

标签: javascript jquery html

我想将一些数据从一个HTML页面发送到另一个HTML页面。我通过http://localhost/project/index.html?status=exist等查询参数发送数据。此方法的问题是数据仍保留在URL中。是否有任何其他方法使用JavaScript或jquery跨HTML页面发送数据。

4 个答案:

答案 0 :(得分:58)

为什么不将您的值存储在HTML5存储对象中,例如sessionStoragelocalStorage,请访问HTML5 Storage Doc以获取更多详细信息。使用此功能,您可以在本地临时/永久存储中间值,然后再访问您的值。

存储会话的值:

sessionStorage.getItem('label')
sessionStorage.setItem('label', 'value')

或更永久地:

localStorage.getItem('label')
localStorage.setItem('label', 'value')

因此,您可以使用HTML5存储对象在多个页面之间存储(临时)表单数据,您甚至可以在重新加载后保留这些对象。

答案 1 :(得分:17)

我知道这是一个老帖子,但我想我会分享我的两分钱。 @Neji是正确的,因为你可以使用sessionStorage.getItem('label')sessionStorage.setItem('label', 'value')(虽然他有setItem参数倒退,但没什么大不了的。我更喜欢以下内容,我认为它更简洁:

var val = sessionStorage.myValue

取代getItem

sessionStorage.myValue = 'value'

取代setItem

此外,应该注意的是,为了存储JavaScript对象,必须对它们进行字符串化以设置它们,并进行解析以获取它们,如下所示:

sessionStorage.myObject = JSON.stringify(myObject); //will set object to the stringified myObject
var myObject = JSON.parse(sessionStorage.myObject); //will parse JSON string back to object

原因是sessionStorage将所有内容都存储为字符串,所以如果你只是说sessionStorage.object = myObject,你得到的只是[object Object],这对你没什么帮助。

答案 2 :(得分:5)

如果您只想传输数据以供JavaScript使用,那么您可以使用哈希标记 像这样

http://localhost/project/index.html#exist

所以一旦你完成了数据显示消息并改变了 window.location.hash到一个合适的值..现在每当你刷新页面时,hashtag就不存在了 注意:当您使用此字段而不是查询字符串时,服务器无法重试/读取正在发送的数据

答案 3 :(得分:3)

嗯,你实际上可以通过JavaScript发送数据 - 但你应该知道这是网页中排名第一的漏洞来源,因为它是XSS:)

我个人建议改用HTML公式而修改服务器端的javascript数据。

但是如果你想在两个页面之间共享(我认为它们不是都在localhost上,因为在两个后端驱动的页面之间共享是没有意义的)你需要指定允许的CORS头部浏览器将数据发送到白名单域。

这两个链接可能对您有所帮助,它通过Node后端显示示例,但您明白了它是如何工作的:

Link 1

当然还有CORS规范:

Link 2

〜干杯