将不可编辑的行号实现为一组预标记

Question

我想要一组可编辑的pre标记，每个标记代表一行文本。该行应以行号开头（不可编辑），然后可编辑。如果我执行<span contentEditable="false">1 </span><pre contentEditable="true"></pre>，则span不可编辑，pre可编辑，但pre在下一行。

如果我更改它，使span位于pre（<pre contentEditable="true"><span contentEditable="false">1 </span></pre>）中，那么整个内容都是可编辑的，1显示在行的中间，带有奇怪的标签

如何获取pre行开头的行号？

Answer 1

简单的代码编辑器，没有javascript。

http://jsfiddle.net/oswaldoacauan/tpY4Y/