Question

我一直在寻找本地存储选项和插件，如Persist.js，sessvars.js，甚至是sisyphus.js - 但我不确定是否最适合（尽管我很确定我需要使用一个）。

第一页是一个表单，其中包含名称，电话和电子邮件等数据的输入字段。只要需要更多输入，我就有一个复制包装div（及其输入）的按钮。填写表单后，用户点击提交，将其带到“确认”类型的php页面。我需要在第2页上为用户提供一个“编辑”按钮，将其带回第1页并单独保留所有信息。

在大多数情况下，一切都返回正常，但如果用户在提交之前点击了“复制”按钮，然后点击编辑，那么动态生成的所有输入都将返回空，并且div不再存在。有人建议我的变量不是持久的（当复制按钮被命中时，带有id =“name1”的输入变成“name2”等等）所以当我发现之前提到的插件时。

有没有办法可以实现其中一个插件（或任何其他方法），以便当用户返回第一页时div和它的输入值保持不变？如果我在正确的轨道上有任何例子吗？

Answer 1

欢迎使用stackoverflow！我真的不知道那些插件，但是在低级别他们可能正在使用localStorage或sessionStorage（我认为这对你的问题更好，因为每次你重新启动浏览器时都会清除它，而不是localStorage，这是永久的，除非用户清除它。）

你的问题有一个非常简单的解决方案，虽然我没有看到一些代码就完全不了解它。

但是或多或少我建议你，当你动态生成字段时，用提交时存储的值预先填充它们，即（假设你使用jquery）：

function generateFields(index) {
    $("<input/>")
          .attr("id","username_"+index)
          .val(getFieldValue("username_"+index))
          .change(function() {
                  setFieldValue("username_"+index, this.value);
          })
          .appendTo(fieldContainer);
    .
    .
    .
}

function getFieldValue(name) {
    return sessionStorage[name]||"";
}
function setFieldValue(name, value) {
    sessionStorage[name]=value||null;
}

这个想法是，在第一次运行时，getFieldValue（无论如何）将返回“”。然后分配用户在更改时输入的值。如果重新执行此代码，则字段将填充先前的值。

您还应该在适当的时候清除存储的值。

注意 - sessionStorage＆amp; localStorage是基本的HTML / 5功能，它们在所有HTML5浏览器中都可用，但在（非常）旧浏览器中显然不存在。希望它有所帮助！

JS：跨页面存储动态变量？

1 个答案: