Zunächst ist dies ähnlich wie folgt:
Iframe-Inhalt im IE bearbeiten - Problem bei der Pflege der Textauswahl
Wie bekomme ich Caret-Position in contenteditable div mit HTML-Kind-Elementen?
Im Grunde schreibe ich etwas, das dem neuen Tweet-Editor in Twitter ähnlich ist. In einem div mit contentEditable setze ich den Text. Wenn ich feststelle, was ich für eine URL halte, entferne ich diesen Text und gebe ein <a> -Tag in das div ein (zB eingegebene Nachricht von go to www.google.com wird Go to <a href='..'>www.google.com</a> . ABER die Caret-Position ist verloren, wenn ich das tue .
Den Vorschlag von @ Tim-Down in diesen anderen SO-Beiträgen zu verwenden funktioniert nur so lange, wie Sie das DOM nicht bearbeiten (wie er sagt). Ich bearbeite das DOM, also ist die Caret-Position verloren.
Ist es möglich (idealerweise ohne Verwendung der angegebenen Rangy-Bibliothek), dies durch Bearbeiten des aktuellen Codes zu erreichen.
Der Code, den ich momentan habe (von den anderen SO-Posts):
%Vor%Und ich benutze es so:
%Vor%Wenn der Text, den der Benutzer sieht, derselbe ist (was Ihrer Frage zufolge wahrscheinlich der Fall ist), könnten Sie eine auf einem Zeichenoffset basierende Lösung verwenden. Ich habe etwas Code dafür an anderer Stelle auf Stack Overflow gepostet:
Ich habe auch kürzlich eine verwandte Frage beantwortet:
jQuery: Konvertieren Sie die Text-URL so, dass sie als Eingabe verlinkt wird
Tags und Links javascript dom