JavaScript简单网格？

Question

我需要一个简单的(超文本标记语言/JavaScript)的工作示例来实现以下目标。在一个三列五行的表格中，第一列是一个文本框。第二列是名为EDIT的按钮/链接，第三列是名为SAVE的按钮/链接。

当我点击编辑，比方说第三行，第三行的文本框应该是可编辑的。我输入文本，然后单击保存。它应该恢复为只读。前提是它应该是逐行可编辑的。

你能提供一个有效的例子吗？或者给我一个相关的资源？

Answer 1

我建议研究一下框架。相信我，除非你的目的是学习某些东西是如何工作的(我不会从你的问题措辞中得到这种印象)，否则你会发现从头开始实现要比使用框架困难得多。

我建议看看Ext Framework (我的个人偏好)，因为他们有一个非常简单的EditableGrid，安装和使用起来都很快。

Answer 2

我很欣赏这个问题已经11年了，但是为了继续帮助那些可能会在几年后读到这篇文章的社区，我觉得我应该提到我已经在JS上创建了一个简单的网格系统，它将能够帮助为这个问题提供解决方案……还有很多其他的！

它的名字叫JSGridSystem

你可以在这里找到代码和一个有效的演示。

https://github.com/cwoolf123/JSGridSystem

只要你编辑你的html & javascript到文档...代码将复制您创建的任何内容，并将其返回到具有所需正确宽度的网格id。

Answer 3

参见YUI DataTable。这不完全是你所要求的，但这可能是一个合理的起点。