nicht angemeldet
Liebe(r) thetrue,
wie kann ich das in firefox realisieren? (var start = sinedit.getSelection().selectionStart; geht nicht ;) )
Firefox (und mit ihm alle Geckos) hat ein vollkommen anderes Konzept hinter seinem selection-Objekt. Es ist nicht so leicht dahinter zu kommen, wie es genau funktioniert. Jedenfalls habe ich mich einen ganzen Tag lang mit der Gecko-Doku umhergeschlagen, um zu begreifen, wie das mit der Cursor-Position in einem designMode="on"-iFrame geht.
Dazu muss man sich Folgendes klarmachen: Das selection-Objekt verwaltet verschiedene "ranges", die sich im praktischen Verlauf aber auf eine einzige reduzieren. Programmiertechnisch könnte man verschiedene ranges erzeugen, etwa eine "selektive Mehrfachauswahl" im Text, wie im Windows-Explorer das gezielte Markieren und Auslassen mit gedrückter Steuerungstaste, aber das Interface des Browsers lässt dich solche Markierungen nicht machen. Aber wie gesagt - im "Normalfall" (also ohne Zutun eines Scriptes) hast Du nur ein range-Objekt, das Du mit myselection.getRangeAt(0) erwischst. Die Null steht hier für die Rangenummer Null.
Wenn Du nun die "Cursorposition" haben möchtest, dann ist das im Wesentlichen das Ende einer Markierung, und wenn nichts markiert ist, dann ist es eine "kollabierte" (collapsed) Markierung - eben Dein Eingabecursor. Also hat eine Range _immer_ einen Anfangspunkt und einen Endpunkt. Das muss einem klar sein!
Das Ende und den Anfang einer Markierung bekommst Du über das entsprechende range-Objekt, denn es enthält zwei Unterobjekte "startContainer" und "endContainer". Diese beiden Objekte sind Referenzen auf die HTML-Elemente, innerhalb derer die Markierung beginnt, bzw. endet. Die exakte Position innerhalb dieser Elemente wird in einem Offset gespeichert: myRange.startOffset bzw myRange.endOffset. Dadurch ist es sehr exakt möglich, nicht nur die Cursorposition innerhalb einer Textzeile, sondern die Cursorposition innerhalb des dahinter stehenden HTML-Quelltextes zu ermitteln.
Angenommen Du siehst im Iframe folgende TextZeile:
Lorem ipsum dolor sit amet.
Der dahinter stehende Quelltext soll einmal dieser sein:
<p>Lorem <span class="blah">ipsum <strong>dolor</strong> sit</span> amet.</p>
Und nun sagen wir, der Cursor sitzt vor dem "l" in "dolor". Dann haben folgende Objekte im FF (respektive alle Geckos) folgende Werte (Irrtümer meinerseits nicht ausgeschlossen!):
selection-Objekt (z.B. var mySelection = window.getSelection();):
anchorNode (Referenz auf das STRONG-Element)
anchorOffset (Die Zahl 3, da nach dem dritten Zeichen)
focusNode (Referenz wiederum auf das STRONG-Element)
focusOffset (wiederum die Zahl 3)
range-Objekt (Range Nr. 0, z.B. var myRange = window.getSelection().getRangeAt(0);):
startContainer (Referenz auf das STRONG-Element)
startOffset (Die Zahl 3, da nach dem dritten Zeichen)
endContainer (Referenz wiederum auf das STRONG-Element)
endOffset (wiederum die Zahl 3)
Da es sich um eine collapsed Range handelt, entsprechen sich anchorNode und focusNode (selection), sowie startContainer und endContainer (range) und verweisen alle vier auf das obige STRONG-Element. Es haben auch alle Offsets den Wert drei.
Tja, und was Du jetzt damit anfängst, das muss ich Dir überlassen, denn weiter bin ich damit auch noch nicht sehr viel. Mein eigenes Projekt dieser Art liegt momentan auf Eis... Aber Du darfst natürlich gerne im Quelltext meines Scriptes herumstöbern.
Liebe Grüße aus Ellwangen,
Felix Riesterer.