Question

我一直无法找到它，但有没有推荐的JavaScript库/插件允许用户编辑表中的数据，就像任何类型的输入一样？或者我应该在表格的<td />标签中创建一个包含文本输入的表格？

Answer 1

将神话般的Datatables jquery插件与其可编辑的插件结合使用 - 请参阅此处演示：http://jquery-datatables-editable.googlecode.com/svn/trunk/index.html

数据表 - http://datatables.net/ 添加可编辑性的插件 - http://code.google.com/p/jquery-datatables-editable/

Answer 2

此功能是否适合您的需求？ http://itlivewire.com/tuts/jquery-dynamically-change-table-rows.html

或者，如果您希望客户端能够编辑表，则此插件可能更有用： http://code.google.com/p/jquery-datatables-editable/

Answer 3

如果您对没有插件的解决方案感兴趣，只需定位单元格，

如果你知道桌子的ID：

document.getElementById("**tableID**")
  .getElementsByTagName("tr")[Row Number]
  .getElementsByTagName("td")[Cell Number];

否则你需要从索引中选择表

document.getElementsByTagName("table")[Table Number]
  .getElementsByTagName("tr")[Row Number]
  .getElementsByTagName("td")[Cell Number];

例如，如果有一个包含2行和2列的表格，我希望它们都有一个数字，我只会这样做：

var tableElm = document.getElementById("**tableID**") //table element
  .getElementsByTagName("tr")[0]  //row element
  .getElementsByTagName("td");  //individual cells

the table and row selection is now cached in tableElm
tableElm[0].innerHTML = "1";
tableElm[1].innerHTML = "2";
tableElm[2].innerHTML = "3";
tableElm[3].innerHTML = "4";

你甚至不需要“.getElementsByTagName（”tr“）[0]”，除非你有理由查询行本身。如果你摆脱它，CELL NUMBER将包括表格的每个单元格而不管行。

是否可以编辑HTML表格中的数据？

3 个答案: