JS - getRangeAt: DIV:Zeilen (Absätze) verbinden möglich?

[Axel Richter]

Hallo,

Nehmen wir an im Div steht:

<div>
Hallo wie geht es?
Danke mir gehts super!
</div>

Das steht ja aber nicht im DIV, wenn das contentEditable ist und Enter gedrückt wurde. Da sind ja dann <br> drin, was Du ja offensichtlich lt. Code auch weißt. Mit jedem <br> beginnt ein neuer startContainer.

Siehe:
https://developer.mozilla.org/en-US/docs/Web/API/Selection.getRangeAt
https://developer.mozilla.org/en-US/docs/Web/API/range

Du musst also mit diesen Containern arbeiten. Bsp.:

  
<div id="newest" onClick="this.contentEditable='true'">  
Hallo wie geht es?  
Danke mir gehts super!  
</div>  
  
<input type="button" id="button">  
  
<pre id="monitor"></pre>  
  
<script>  
  
[code lang=javascript]document.getElementById("button").onclick = function(e) {  
  
 document.getElementById("monitor").innerHTML = document.getElementById("newest").innerHTML.replace("<","&lt;");  
  
 var sel = window.getSelection();  
  
 var ersteSelRange = sel.getRangeAt(0);  
  
 if (!ersteSelRange.collapsed) {  
  
  var startContainer = ersteSelRange.startContainer;  
  var endContainer = ersteSelRange.endContainer;  
  
  if (startContainer == endContainer) {  
  
   var posStart = ersteSelRange.startOffset;  
   var posEnd = ersteSelRange.endOffset;  
  
   var startContainerText = startContainer.textContent;  
  
   var ersteSelRangeText = ersteSelRange.toString();  
  
   startContainer.textContent = startContainerText.substr(0, posStart) + "||" + ersteSelRangeText + "||" +  
  
startContainerText.substr(posEnd);  
  
  }  
 }  
};

</script>
[/code]

Allerdings frage ich mich, was das werden soll. Was soll da bei Dir genau vor und nach der markierung eingefügt werden?

viele Grüße

Axel