Wählen Sie den Bereich in contenteditable div

Ich habe eine contenteditable Div und ein paar Absätze drin.Wählen Sie den Bereich in contenteditable div

mein Code hier:

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    </head> 
    <body> 
     <div id="main" contenteditable="true" 
      style="border:solid 1px black; width:300px; height:300px"> 
      <div>Hello world!</div> 
      <div> 
       <br> 
      </div> 
      <div>This is a paragraph</div> 
     </div> 
    </body> 
</html>

Angenommen, ich möchte eine Bereichsauswahl treffen, die die Zeichenfolge enthalten wird! „Welt Das ist“

Wie das zu tun?

Quelle

2010-09-22 angry kiwi

Sobald Sie die Textknoten gefunden haben, die den markierten Text enthalten, ist es einfach. Wie Sie diese bekommen, hängt davon ab, wie allgemein Sie dies brauchen. Da es im Moment ist, bevor der Benutzer es bearbeitet hat, wird folgende Arbeiten:

var mainDiv = document.getElementById("main"); 
var startNode = mainDiv.firstChild.firstChild; 
var endNode = mainDiv.childNodes[2].firstChild; 

var range = document.createRange(); 
range.setStart(startNode, 6); // 6 is the offset of "world" within "Hello world" 
range.setEnd(endNode, 7); // 7 is the length of "this is" 
var sel = window.getSelection(); 
sel.removeAllRanges(); 
sel.addRange(range);

Quelle

2010-09-22 21:31:40

'removeAllRanges' und dann' addRange' die Stücke waren ich für meine Situation fehlte. Danke für den Code! – siannopollo

Wählen Sie den Bereich in contenteditable div

Antwort

Verwandte Themen