Question

我是Javascript的初学者，我的教授到目前为止只教我们HTML5和Javascript，所以我不能使用PHP lol。到目前为止，我有一个页面，其中有一个用户可以输入数据的表单，我有一个外部javascript文件，它有两个功能来验证密码并自动填充来自结算信息的交付信息。在表单标签中我有onsubmit =“return verifyPswd（）”，并且可以从HTML文件外部调用它。但我正在尝试做的是现在从URL（我使用method =“GET”）或其他方式拉取表单数据，并在我的第三个HTML页面上显示数据，这是结果页面。我已经尝试了一切，甚至将javascript代码移动到第一个HTML页面中，并且没有任何工作，所以我注册了SO。

我认为这部分代码对于准确的帮助非常重要。非常感谢提前。

我的表格html页面：

<body>
<h1>OrderUp!</h1>
<form name=orderup method="get" action="Results.html" onsubmit="return verifyPswd()">
...ALL THE FORM CODE...
<input id= "order" type="submit" value="Place Order"></center></input>

我的结果html页面：

<body>
<h1>OrderUp!</h1>
<center><p id = "success">Your form has been successfully submitted!</p>
</center>
</body>

我想最困难的部分或最令人困惑的部分是我在哪里调用函数来显示条目？！在结果页面或表单页面？你有两个提交吗？我很沮丧。

Answer 1

如果没有服务器代码，您的数据将不会在您的网页中保留，因此您需要一个全局商店，每个商店都有权访问。你不能简单地抓取一个javascript文件，并设置变量，因为当下一页加载它们时，它不会查看这些变化。

我强烈建议（暂时）将您的值存储在浏览器的会话存储或本地存储中。只要您在域中，数据就会一直存在。

以下是您在javascript中执行此操作的方法：

// Save data to sessionStorage
sessionStorage.setItem('key', 'value');

// Get saved data from sessionStorage
var data = sessionStorage.getItem('key');

// Remove saved data from sessionStorage
sessionStorage.removeItem('key');

// Remove all saved data from sessionStorage
sessionStorage.clear();

会话存储只会保留值，直到您的浏览器关闭，如果您关闭浏览器并返回，将保留localstorage。

对于本地存储，您只需将上述“sessionStorage”替换为“localStorage”

请在此处查看参考资料：

https://github.com/RoXuS/paper-datatable-api

Answer 2

您可以使用localstorage保存您的项目，并将其放入其他页面：

localStorage.setItem("yourDataKey", "This can be anything, simple string, or a complex object");

并将其恢复到其他页面：

var myDataFromFirstPage = localStorage.getItem("yourDataKey");

如果你需要删除它，你也可以这样做：

localStorage.removeItem("yourDataKey");

您可以传递任何类型的数据，它可以是简单的字符串或复杂的对象。

如何使用ONLY javascript将表单数据从一个HTML页面传递到另一个HTML页面？

2 个答案: