javascript - 如何在表中添加数据

Question

我的问题是我当前的代码不起作用

当前输出:http://jsfiddle.net/4GP2h/50/

Answer 1

这里发生了很多事情:

• 您有多个具有 id 性别的元素，使您的 html 无效。

• You can't store an array directly into localStorage你需要 stringify()它在插入之前 parse()检索后。

• localStorage.setItem() 函数有两个参数，要存储的数据的名称(key)和实际数据(值)

你用单个参数调用它，比如

localStorage.setItem(data) //Uncaught TypeError: Failed to execute 'setItem' on 'Storage': 2 arguments required, but only 1 present. 

应该类似于 localStorage.setItem('info',data)。

这样您就可以在页面加载时使用 localStorage.getItem() 访问数据，例如 localStorage.setItem('info')。

(我以前没有使用 datatables 的经验，所以我浏览了 examples 和 API 文档)

获得数据后，您需要指定 data和 columns初始化表时的选项(这个 example 演示了如何使用来自 js 源的数据初始化 dataTable。)如下:

$('#myTable').dataTable({
  "data": dataSet,
    "columns": [{
    "title": "Name"
  }, {
    "title": "Age"
  }, {
    "title": "Gender"
  }, {
    "title": "Action"
  }]

// rest of the options
});

如您在文档中所见，data选项接受一个 2D 数组；因此，不是将单个记录保存在数组中，而是创建一个包含所有记录的数组并将其保存在 localStorage

下面的 fiddle 可以让你在 localStorage 中保存一条记录(我暂时将它包装在另一个数组中)，下次访问时检索并显示它。

Updated Fiddle

如 Anthony 所述评论里最好在unload保存一次事件，而不是每次创建记录时都尝试更新 localStorage。