Hi!
Ich bastle gerade an einem kleinen Quelltext-Editor, der in einem pre mit contenteditable=true sitzt. Der Editor beherrscht syntax highlighting, d.h. innerhalb des pre-Containers finden sich Unmengen von span-Tags nach folgendem Schema:
<pre id="editor">
<span class="php">
<span class="keyword">var</span>
<span class="variable">$test</span>
<span class="operator">=</span>
</span>
<span class="string_interpolated">"Text</span>
<span class="escaped">\n</span>
<span class="string_interpolated">"</span>
</span>
</pre>
und so weiter. Das Highlighting klappt soweit ganz gut, zwingt mich aber, die spans oft zu löschen und neu zu rendern (z.B. wenn ein Anführungszeichen gelöscht). Das Problem ist jetzt, dass jedes mal, wenn eine span ersetzt werden muss, der Textcursor zum letzten nicht ersetzten Element zurückspringt.
Ich kann zwar mir window.getSelection rausfinden, wo sich der Cursor vor dem Ersetzen der spans befindet, aber leider wird die Position relativ zum aktiven span und nicht zum Wurzelelement des editierbaren Bereichs angegeben. Daher die Frage: Gibt es a) eine Möglichkeit, den Browsern (IE ist erstmal zweitranging) beizubringen, dass sie den anchorOffset relativ zu einem von mir bestimmten Element berechnen, und b) eine Möglichkeit, die Textcursor-Position auch relativ zu einem beliebigen Elternelement zu setzen?