Cursor zum letzten Eingang bewegen

Question

Ich habe einen textarea, in dem der Benutzer Text eingeben kann. Der Benutzer kann auch einen Knopf drücken, um Dinge wie Bilder und Links hinzuzufügen. Diese Schaltfläche fordert sie nämlich zur Verknüpfung auf und gibt dann den korrekten HTML-Code in das Textfeld ein, in dem sich der Cursor befand. Ein Arbeitscodebeispiel ist dies:

jQuery('input#btn').click(function(e) { 
    var link = prompt("Please paste the link", "http://"); 
    jQuery('textarea#id1').insertAtCaret('<a href="'+link+'">link text</a>'); 
}); 

Die .insertAtCaret() Funktion ist die, mit freundlicher Unterstützung von Daniel Beck for another question of mine erstellt. Es findet die Position des Cursors im Textfeld, so dass der HTML-Chunk hier hinzugefügt werden kann.

Aber nachdem jQuery diesen HTML-Chunk hinzugefügt hat, ist der Cursor nicht mehr in der Textarea, aber Fokus ist jetzt auf die Schaltfläche, die geschoben wurde. Ich möchte, dass der Cursor dort bleibt, wo er war, bevor er diesen Button drückt (nach dem hinzugefügten HTML-Chunk).

Ist es möglich, den zuletzt eingegebenen Text in einem Textfeld zu finden und ist es dann möglich, den Cursor dorthin zu bewegen?

Hinweis, dieser Eingang könnte irgendwo im bereits geschriebenen Text in textarea sein.

Answer 1

Zuerst müssen Sie den Fokus auf Ihren Textbereich zurücksetzen.

var te = document.getElementById('id1'); 
te.focus(); 

Und zweitens den Cursor auf bestimmte Position setzen.

var mySavedPosition = 3 // or whatever it was before 
te.selectionStart = mySavedPosition; 
te.selectionEnd = mySavedPosition; 

Das ist es.

bei Ihrem Beispiel So könnte es wie hier aussehen:

jQuery('input#btn').click(function(e) { 
    var link = prompt("Please paste the link", "http://"); 
    var te = document.getElementById('id1'); 
    var pos = te.selectionStart; 
    jQuery('textarea#id1').insertAtCaret('<a href="'+link+'">link text</a>'); 
    te.selectionStart = pos; 
    te.selectionEnd = pos; 
}); 

Und sorry, aber ich bin kein Freund von jQuery, so dass ich nur einheimischer JS.

aktualisiert

Ich habe übersehen, dass Sie die Cursor an dem Ende der eingesetzten Stelle mögen. Da ich die Länge des eingefügten Textes nicht kenne, bekomme ich am besten die Position vom Ende her.

jQuery('input#btn').click(function(e) { 
    var link = prompt("Please paste the link", "http://"); 
    var te = document.getElementById('id1'); 
    var pos = te.textLength - te.selectionStart; 
    jQuery('textarea#id1').insertAtCaret('<a href="'+link+'">link text</a>'); 
    te.selectionStart = te.textLength - pos; 
    te.selectionEnd = te.textLength - pos; 
});