是否可以限制全选/ Ctrl + A的范围？ [英] Is it possible to restrict the range of select all/Ctrl+A?

问题描述

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

I am working on a website where I would like to be able to display a box containing syntax-highlighted source code for the user to copy. When I click on the box, giving it focus (Chrome shows its focus outline), and type Ctrl+A, the text of the entire page is selected, whereas I would like only the syntax-highlighted source code within the box to be selected.

是否可以将全选/ Ctrl + A 的范围限制为仅框，最好不要使用< iframe>？

Is it possible to restrict the range of select all/Ctrl+A to only the text within the box, preferably without using an <iframe>?

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

My first thought was to try contenteditable. When I click in the box and the editor caret appears, typing Ctrl+A selects only the text within the box, as desired, but it also allows the user to change the code, and I think that the editor-interface aspect of making the box contenteditable will be confusing to users. If I wrap the source code text within a <div> having contenteditable="false" within the <div> having contenteditable="true", then the source code text is read-only, but typing Ctrl+A selects the text of the entire page again.

这是一个测试页： http：// jsfiddle。 net / 5crgL /

推荐答案

您可以使用 document.createRange（）; 方法从特定元素中选择文本。
并使用ctrl + a来处理ctrl + a，您可以使用jQuery keydown 方法，并可以调用JS代码来选择DIV文本。

You can use the document.createRange(); method to select the text from a particular element. and to handle the ctrl+a you can use the jQuery keydown method and can call the JS code to select the DIV text.

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

请在此处jsfiddle http://jsfiddle.net/5crgL/3/ rel = nofollow> jsfiddle 。

please see jsfiddle here jsfiddle.

这篇关于是否可以限制全选/ Ctrl + A的范围？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！