javascript - 在按钮按下时动态添加表单元素，这些元素在页面重新加载后保留

Question

我正在用 PHP 创建一个多页表单。

我正在使用 JavaScript 来允许用户创建新的文本字段。

function add() {
    document.getElementById('wrapper').innerHTML += '<input type="text"><br><br>';
}

由于它是一个多页表单，用户可以选择返回到之前的页面。问题是，一旦页面重新加载，已添加的额外文本字段就会消失。重新加载页面后，我将如何将它们保留在页面上？我是否需要创建一个 cookie 来存储添加的表单元素？

Answer 1

我要做的是将它们存储在 sessionStorage 中，然后在页面加载时加载它们。

function add() {
    document.getElementById('wrapper').innerHTML += '<input type="text"><br><br>';
    sessionStorage.inputBoxes = document.getElementById('wrapper').innerHTML;
}

window.load = function() {
   if (sessionStorage.inputBoxes) {
      document.getElementById('wrapper').innerHTML = sessionStorage.inputBoxes;
   }
};

我确实写了一个插件http://github.com/sebringj/jquery.dumbformstate保持表单状态，不是在动态控件方面，而是在使用 session 和本地存储保持表单输入状态方面。