11

次のロジックのように、ローカル ストレージに保存して 再度再利用する方法はありますか。

フォーム::::::::::::saveINTO::::::::::::::> ローカルストレージ

form <::::::::::::getFROM::::::::::::::: ローカル ストレージ

フォームにデータを入力した後、その内容を含むフォームをローカルストレージに保存し、保存されたデータを他のフォームに入力したい場合。

<form>
    First name: <input type="text" name="firstname"><br>
    Last name: <input type="text" name="lastname">
    <button onclick="StoreData();">store into local storage</button>
</form> 
<button onclick="RenderForm();">render from data again </button>
<form id="Copyform"><form>

JSFIDDLE JSFIDDLE 回答してください。

更新しました

4

2 に答える 2

11

You can do that easily, but if you want to store an array you will need to serialize or encode it first because localStorage doesn't deal with arrays. e.g.:

var yourObject = $('#your-form').serializeObject();

To save you do either:

localStorage['variablename'] = JSON.stringify(yourObject) or localStorage.setItem('testObject', JSON.stringify(yourObject));

and to retrieve: JSON.parse(localStorage['yourObject']); or JSON.parse(localStorage.getItem('yourObject')); and then the field values are available as yourObject.fieldName;

EDIT: In the example above I used serializeObject which is a jQuery plugin. The code used is below. (You can use serializeArray if you prefer but you will have to do more work to make your data usable once retrieved):

jQuery.fn.serializeObject = function () {
  var formData = {};
  var formArray = this.serializeArray();

  for(var i = 0, n = formArray.length; i < n; ++i)
    formData[formArray[i].name] = formArray[i].value;

  return formData;
};
于 2013-11-13T11:28:28.770 に答える