如何在本地存储HTML表单数据？

我正在制作一个HTML表单，我需要我的用户在关闭窗口/选项卡并重新打开之后能够找回他们填满的任何数据。如何在本地存储HTML表单数据？

如果我使用JavaScript cookies或HTML 5本地存储，那么我将不得不为每一个输入标签编写代码，即使它的数量是千分之一。

那么，最有效的方法是什么？

P.S.我使用PHP进行后端处理。

我想要的功能就像我们在浏览器中使用firefox或chrome恢复会话一样。

来源

2015-08-24 Aman Kumar

@PraveenKumar我的不好。跳入结论。 – RRK

*关闭窗口/选项卡并重新打开后，他们填满的任何数据。*这对我来说还不清楚。您想要什么？这意味着什么？ mabe ** Session **可以帮助您 – donald123

真的没有办法迭代您的输入字段吗？ – user3154108

你可以像这样使用localstorage。

localStorage.setItem('formData', JSON.stringify($('form').serialize())); //comfortable java script way.

或Cookie，可以喜欢这个

$.cookie('formData', JSON.stringify($('form').serialize())); //can support old browsers also.

请阅读storage-vs-cookies优良接受的答案，你会知道使用哪一个。

来源

2015-08-24 11:58:13 Raghavendra

LocalStorage是您的最佳选择。

我将不得不为每一个输入标签编写代码，即使它像数千个一样。

这是不正确的。您可以使用JS循环，或一个jQuery各，要做到这一点：

$("input").each(function(){ 
       $(this).val(storage.getItem($(this).attr("id"))); 
      }) 
      .change(function(){ 
       storage.setItem($(this).attr("id"), $(this).val()); 
      });

页面加载后，您将遍历页面上的每个输入，并把内容到它基于输入的ID.Then你附上所有输入的事件监听器，将所有更改保存到本地存储中。

我还没有测试过这个，它只是为了插图的目的。这段代码可能不会马上起作用，但我希望你能理解这个概念。

来源

2015-08-24 11:53:11

如何在本地存储HTML表单数据？

回答

相关问题