Highlight / select multiple sections with ranges w / contenteditable?

Say I have a set of contenteditable="true"divs.

<div id="0" contenteditable="true"></div>
<div id="1" contenteditable..></div>
<div...etc></div>

I cannot have one div, multiple divs are required. How can I highlight the contents of more than one div? Using ranges? Anything else?

+5
source share
2 answers

The answer is that it depends on the browser. See this example for testing two methods using ranges. The first attempts to create a range for the editable <div>and add all of them to the selection. The second attempt to create one range covering the contents of two editable <div>s.

:

  • , ;
  • Firefox . .
  • Safari Chrome : .
  • Opera 11 , , .
  • IE pre-version 9 DOM Range API Selection, , TextRange .
+6

divs contenteditable="false" , . - ( JQuery):

$('div').bind("selectstart", function() {
    $('div').attr("contenteditable", false);
});​

( Chrome).

, ContentEditable Div . , -, , , divs, .

, , contenteditable="true" . , .

+3

All Articles