如何在javascript中的不同html页面之间传递变量值

Question

我想将所选列表项的值传递给另一页,这意味着如果我从列表中选择abc然后这个abc值传递给下一个html表单,它应该只打开那个配置文件页面.我有什么方法可以在不同的html页面中使用此变量.

$('.ui-li-icon li').click(function() {
    var index = $(this).index();
    text = $(this).text();
    alert('Index is: ' + index + ' and text is ' + text);

我想将上面的文本值传递给我的profile.html,它有javascript函数profile().所以我想在函数调用中传递这个文本,如profile(text);我尝试在函数调用上面声明var text但仍然是不工作.请告诉我是否有其他方式.

Answer 1

您可以将值作为url片段传递.

在您的点击功能中,打开'/profile.html#'+text

在您的profile.html中获取url片段.

示例代码:

要导航到profile.html

window.location.href = '<path to profile.html>' + '#' + text;

在profile()中,要获取参数,请使用

var text = window.location.hash.substring(1)

Answer 2

有不同的方法来做到这一点

将所选项目存储在cookie中

 // Store it in the cookies
 document.cookie="selected=john"

// Get it in the profile.html
var cookie = document.cookie;

将所选项目存储在本地存储中

// Store it in the local storage
localStorage.setItem('selected', 'john');

// Get it from the local storage
var selected = localStorage.getItem('selected');

使用查询参数(推荐)

您可以在查询参数中传递所选项目profile.html?selected=john.我推荐这种方法.您可以通过阅读所选项目location.search

Answer 3

HTML / HTTP是无状态的，这意味着您在上一页所做的/与当前页面完全断开。

1）-使用前端存储很简单，前端存储可配备任何浏览器（Cookie，会话存储，本地存储），并将价值放在一个页面中，而在另一页面中获取价值。

考虑到：

Cookie会保存数据，直到您确定了什么时间为止，

会话存储将保存数据，直到关闭浏览器默认选项卡

本地存储会保存数据，直到浏览器完全关闭，并在选项卡（页面）之间共享该数据。它存储没有到期日期的数据，并且仅通过JavaScript或清除浏览器缓存/本地存储的数据来清除-与cookie到期不同。

2）–将其另存为请求参数的第二种方法-通过Ajax渲染函数生成的元素时，向该元素添加属性另一个链接

->然后单击此元素，构建“ URL /？action = getAll＆element = product＆id = 1212”，在将要执行的第二页中，您可以解析此URL并使用适当的参数调用适当的Ajax。

可能这些附加信息也会有所帮助

如何将javascript对象从一页传递到另一页

有关“客户端存储解决方案”的其他信息

localStorage，sessionStorage，session和cookie之间有什么区别？