如何在 JavaScript 中跨页面加载保留表单数据？

如何在页面加载之间保留变量

由于 HTTP 是无状态的，因此在页面刷新之间捕获表单提交状态可能具有挑战性。仅使用 JavaScript 很难实现页面加载之间的持久存储。

查询字符串

使用 GET 方法提交表单时，会创建查询字符串 (?parameter=value ）。通过将表单中的输入字段设置为特定值，您可以使用查询字符串。例如：

<form method="GET">
    <input type="hidden" name="clicked" value="true" />
    <input type="submit" />
</form>

提交表单时，查询字符串会更新以包含单击的参数。当页面重新加载时，您可以检查查询字符串以确定是否单击了提交按钮。

Web Storage

HTML5 提供了 Web Storage，允许保存数据在浏览器中跨页面加载。 LocalStorage 无限期地存储数据，而 SessionStorage 仅在当前浏览会话期间保留数据。为此，SessionStorage 是合适的：

$('input[type="submit"][value="Search"]').click(function() {
    sessionStorage.setItem('clicked', 'true');
});

Cookie

Cookie 还可以在客户端存储数据。使用 jQuery，您可以轻松设置 cookie：

$('input[type="submit"][value="Search"]').click(function() {
    $.cookie('clicked', 'true', { expires: 1 }); // expires in 1 day
});

Window.name

作为一种黑客方法，您可以将数据存储在 window.name 属性中：

window.name = JSON.stringify({ clicked: true });

此方法仅限于当前选项卡，并且仅存储字符串。

以上是如何在 JavaScript 中跨页面加载保留表单数据？的详细内容。更多信息请关注PHP中文网其他相关文章！