Javascript 在不同HTML页面之间传递数据

我是PHP新手，非常迷茫

我正在使用HTML5、CSS3、jQuery和Bootstrap4

我的网站上总共有4个HTML页面。在第一页中有4个带有文本的方块（比如A、B、C和D），用户选择其中一个方块，然后按下“下一步”按钮。单击此“下一步”用户将进入第2页，但此页需要根据用户在第1页（A、B、C或D）中的选择进行更新。同样，第2页和第1页的数据也需要转到第3页

我读过关于通过URL、AJAX、PHP会话和其他一些东西来实现这一点的文章，但由于我是新手，所以我非常困惑

请指导我如何在不同页面之间传递数据

---

编辑：我没有使用表单。

您可以使用

localstorage

第一页：（First.html）

第二页：（Second.html）

---

您可以使用本地存储，下面的示例肯定会对您有所帮助

在HTML第1页：

window.onload = function() {
   var sqa = prompt("square: ","A");
   localStorage.setItem("SQA",sqa);
}

在HTML第2页：

window.onload = alert(localStorage.getItem("SQA"));

您可以使用cookies，但存储是更好的选择，因为页面请求不会发送到服务器

在不同HTML页面之间传递数据
A节

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。

下一个
B节

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。

下一个
C节

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。

下一个
D节

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。

下一个
$（文档）.ready（函数（）{
 
$（“.send_data”）。单击（函数（事件）{
  
var url=“”；
设sec=$（this.prop（“value”）；
让数据=$（'#数据'+sec）.val（）；
如果（秒==“A”）{
url='demoA.html'；
}否则如果（秒==“B”）{
url='demoA.html'；
}
否则如果（秒==“C”）{
url='demoA.html'；
}
否则如果（秒=“D”）{
url='demoA.html'；
}
变量形式=$（''）+
'' +
'');
$（'body'）。追加（表格）；
表单提交（）；
    });
  
});

方法取决于目的，这是web开发中的基本概念和组件之一

如果您想存储或记录您的用户交互（用于电子商务或社交网络），您需要在某个时间点（可能在使用本地存储对象之后）将数据传递到服务器，PHP为我们提供了两种常用的机制来将数据从客户端传递到服务器端：$\u GET&$\u POST通过HTML from，这些机制可以保存使用过的cookie或会话

如果页面之间传递的数据永远不会为站点的功能提供任何用途，则可以使用本地存储对象，当大量数据可能存储在用户客户端上时，本地存储对象尤其有用，而不是每次请求都获取这一昂贵的资源，增强用户体验并最小化服务器负载

---

用页面本身创建4个部分。使用

display none

，一个加载段1变为可见，所有其他3个加载段变为隐藏。单击步骤1上的“下一步”时，隐藏所有块，并通过使其可见转到第2节。像这样一直走到第四个街区。在eact下一步中，单击使用

AJAX

将数据保存到会话。您可以使用此会话在刷新时显示数据。有很多方法可以使用javascript和会话进行操作。您也可以存储在localstorage中。您可以使用Cookie，但local Storage允许您使用更多的空间，并且在您请求页面时将发送回服务器。@谢谢您的回复，我已经编写了代码，只有一个“下一步”按钮，因此，您的方法与我的不同。请解释您的解决方案，而不仅仅是在HTML中提供一些代码。在HTML中有四个div，每个div上都有一个带有类、值和一些演示数据的按钮（需要在其他页面上解析）。在jquery函数中，当用户单击一个按钮时，单击按钮的值被分配到函数中，让sec=$（this.prop（“value”）；让数据=$（'#数据'+sec）.val（）；//conatating ID要获取单击按钮的父Div数据，如果您希望在以下情况下重新连接单独的链接（sec==“A”）{url='demoA.html'；}或者如果（sec='B”）{url='demoB.html'；}下面的代码正在传递所需url上的数据，包括append var form=$（'+'+''）$（'body'）。附加（形式）；表单提交（）；您好@fahadpatel，非常感谢您的回复，但我没有将布局编码为表单，因此我正在寻找不使用表单的内容，对不起，我忘记在我的问题中提到这一点。@fahadpatel嘿，我已经得到了解决方案，谢谢您的时间！：）谢谢对于我的代码，localstorage方法

window.onload = function() {
   var sqa = prompt("square: ","A");
   localStorage.setItem("SQA",sqa);
}

window.onload = alert(localStorage.getItem("SQA"));