title: Is it possible to restrict the range of select all/Ctrl+A?
body: <p>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 <kbd>Ctrl+A</kbd>, the text of the entire page is selected, whereas I would like only the syntax-highlighted source code within the box to be selected.</p>
  
  <p>Is it possible to restrict the range of select all/<kbd>Ctrl+A</kbd> to only the text within the box, preferably without using an &lt;iframe&gt;?</p>
  
  <p>My first thought was to try <a href="http://msdn.microsoft.com/en-us/library/ie/ms533690.aspx" rel="noreferrer"><code>contenteditable</code></a>. When I click in the box and the editor caret appears, typing <kbd>Ctrl+A</kbd> 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 <code>contenteditable</code> will be confusing to users. If I wrap the source code text within a &lt;div&gt; having <code>contenteditable="false"</code> within the &lt;div&gt; having <code>contenteditable="true"</code>, then the source code text is read-only, but typing <kbd>Ctrl+A</kbd> selects the text of the entire page again.</p>
  
  <p>Here is a test page: <a href="http://jsfiddle.net/5crgL/" rel="noreferrer">http://jsfiddle.net/5crgL/</a></p>