HTML5将多个文本框存储到本地存储

Question

能够通过一个按钮将一个文本框存储到本地存储中。 我将如何允许它接受“调查”中所有的文本框？ 为每个文本框创建ID，然后将它们全部列在我的JS的获取/设置中？

<label for="serveri"> Server: </label> <input type='text' name="server" id="saveServer"/> <button onclick="saveData()" type="button" value="Save" id="Save">Save</button>

    var save_button = document.getElementById('Save')
save_button.onclick = saveData;
function saveData(){
  var input = document.getElementById("saveServer");
  localStorage.setItem("server", input.value);
  var storedValue = localStorage.getItem("server");
}

为了更好地理解（所有文本框），下面是JSfiddle的全部内容： http : //jsfiddle.net/BDutb/

Answer 1

如果使用类似jQuery的库，则可以非常轻松地获取元素并遍历值。 如果要使localStorage变量名称有意义，则分配输入字段名称，然后可以执行以下操作：

在这里查看我的示例： http : //jsfiddle.net/spacebean/BDutb/11/

$('form').submit(function() {
  $('input, select, textarea').each(function() {
   var value = $(this).val(),
       name = $(this).attr('name');
   localStorage[name] = value;
  });   
});

为了演示起见，我缩短了表格，但是您应该可以从那里获取表格。

编辑：更新了固定的jsFiddle链接。