使行号不可复制

Question

我正在努力为Rainbow提供行号支持,这是一种语法荧光笔,但我无法弄清楚如何使行号不可复制.

禁用选择通过user-select: none;使元素不可突出,但您仍然可以通过突出显示它然后复制来复制其文本,最终复制行号和代码.

以下是该问题的一个工作示例:http://jsfiddle.net/CjJLv/8/

任何帮助,将不胜感激.谢谢!

Answer 1

好吧,兼容浏览器中最简单的方法,遗憾的是,不可靠的跨浏览器,是使用生成的内容(我删除index了插件中文本内容添加的各个部分,并使用了以下内容(在CSS的末尾)实现不可复制的文本:

table.rainbow {
    counter-reset: line;
}

table.rainbow tbody tr td:first-child {
    counter-increment: line;
}

table.rainbow tr td:first-child::before {
    content: counter(line);
}

JS小提琴演示.

但是,这确实有一些相当大的缺陷(跨浏览器不友好的方法是最大的),所以我会尝试更好的东西......