可编辑表格单元格的替代Jeditable

我一直在尝试使用Jeditable来使我的html表可编辑。 然而，经过大量研究，我发现validation输入非常困难（如果不是没有后端）。

我真的不想使用任何类型的插件，只需编写/使用一些Javascript，使单元格可编辑，并允许我将jQuery Validator附加到输入。 数据永远不会被提交到后端（将在页面刷新时返回默认值），因此解决方案不需要复杂…只会使用html和Javascript。

我发现使用Google的大多数代码段的问题是，当您在单元格内单击并单击单元格外部时，它们似乎会卡住，不会保存/提交更改。

有没有人有他们成功使用的片段和/或使用Validator片段的经验？

Answer 1

好吧，根据我在你的另一个问题中得到的信息，你可以将该function改为：

function appendTable(id) { var tbody = document.getElementById(id).getElementsByTagName("tbody")[0]; var i = 0; var rows = tbody.rows; for (var r = 0; r < 4; r++) { var row = rows[r]; for (var c = 0; c < 4; c++) { var cell = row.cells[c]; cell.firstChild.value = subset[i++]; // the only part changed } } } 

当你的HTML看起来像：

 
 
 
 
Header1
 
Header2
 
Header3
 
Header4
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  

正如你所看到的，我依赖于firstChild属性，但它可能很危险，例如当你的html看起来像：

然后至少FF返回作为firstChild。 你不能依赖这个问题：

 cell.getElementsByTagName("input")[0].value = subset[i++]; 

PS。 我写的所有内容都是基于我从另一个问题得到的信息，如果出错了 - 评论，我会尝试改变;）