是否可以限制全选/Ctrl + A的范围？

Question

我正在一个网站上工作，我希望能够显示一个包含语法突出显示的源代码的框供用户复制。当我单击该框并为其设置焦点（Chrome 显示其焦点轮廓）并键入 时Ctrl+A，将选择整个页面的文本，而我只想选择框中的语法突出显示的源代码。

是否可以将 select all/ 的范围限制Ctrl+A为仅框内的文本，最好不使用 <iframe>？

我的第一个想法是尝试contenteditable。当我在框中单击并出现编辑器插入符号时，键入Ctrl+A仅根据需要选择框中的文本，但它也允许用户更改代码，我认为制作框的编辑器界面方面contenteditable将是让用户感到困惑。如果我将源代码文本包含在 <div>contenteditable="false"内的 <div> 内contenteditable="true"，则源代码文本是只读的，但键入会Ctrl+A再次选择整个页面的文本。

这是一个测试页面：http : //jsfiddle.net/5crgL/

Answer 1

您可以使用该document.createRange();方法从特定元素中选择文本。要处理 ctrl+a，您可以使用 jQuerykeydown方法，并可以调用 JS 代码来选择 DIV 文本。

var range = document.createRange();
range.selectNode(document.getElementById(containerid));
window.getSelection().addRange(range);

请参阅jsfiddle这里jsfiddle。