用于就地编辑的CSS

Question

如何创建可编辑的标签？我在表格中显示数据，并希望为显示的数据提供就地编辑。我可以使用哪些CSS样式？

Answer 1

在那里放置一个文本输入框，使其背景与其容器的背景相同，并在其上放置0边框，并使用与表中其他项相同的字体样式和颜色

Answer 2

  

我可以使用哪些CSS样式？

这不是CSS的问题（除非您的问题只与实现特定风格有关）。

你可以：

1. 使所有表格单元格都包含输入。这具有（可能很重要的）缺点，即如果表单被POST，所有数据将被提交给服务器。除非桌子很小或者你从未完全提交整页，否则我不会推荐这种方法。

2. 单击时将标签更改为输入。提交表单后，此值现在将成为请求的一部分。

3. 将标签更改为输入以响应其他地方的操作（例如，对焦行，点击行旁边的编辑按钮等）

4. 在元素上设置contenteditable="true"。这允许丰富的格式化，但也需要您跟踪用户所做的更改;除非将它们放入表单字段，否则它们不会被提交到服务器。

您可能需要/需要一段JavaScript来将标签更改为输入（＃2和＃3）。您将需要使用方法＃4将数据传输到服务器。