将表数据保存到HTML5 LocalStorage [英] Saving table data to HTML5 LocalStorage

问题描述

我创建了一个JSFiddle 这里

I've created a JSFiddle Here

我要做的是从以下代码中保存表格数据：

What I'm trying to do is save table data from the following code:

  $('#save').click(function () {

  $("#dataTable").find('tbody')
      .append($('<tr>')
      .append($('<td>')
      .text($('#fname').val()))
      .append($('<td>')
      .text($('#lName').val()))
      .append($('<td>')
      .text($('#mId').val()))
      );       
  $('#fname').val('');
  $('#lName').val('');
  $('#mId').val('');
 })

我会喜欢保存< tr> 数据，但是我很难找到从哪里开始将其解析成可保存的格式。

I would like to save the <tr> data, but I'm having trouble finding where to start on parsing that into a savable format.

推荐答案

我写了一些小代码来帮助你。

I have written little bit code to help you.

首先为要存储在网格中的记录创建一个类

First create a class for the record which you want to store in grid

function MemberInfo(fName,lName,memberId){
this.FirstName=fname;
this.LastName=lName;
this.MemberId=memberId;    
}

创建一个循环遍历所有tr和tds的函数来填充数组，最后在localStorage中保存JSON数据

the create a function which will loop through all the tr and tds to populate that array, and finally save the JSON data in localStorage

var arr=[];    
    $("#dataTable").find('tbody tr').each(function(index,item){

        var fName=$(item).find('td').eq(0).text();
        var lName=$(item).find('td').eq(1).text();
        var memberId=$(item).find('td').eq(2).text();
        arr.push(new MemberInfo(fName,lName,memberId))
    });


  localStorage.setItem("memberData",arr);

小提琴

这篇关于将表数据保存到HTML5 LocalStorage的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！