Legen Sie die Caret-Position immer in contenteditable div

Question

In meinem Projekt versuche ich, die Caret-Position immer an das Ende des Textes zu setzen. Ich weiß, dass dies Standardverhalten ist, aber wenn wir Text dynamisch hinzufügen, ändert sich die Caret-Position zum Startpunkt in Chrome und Firefox (IE ist in Ordnung, erstaunlich).

Wie auch immer, damit es in Chrome und Firefox richtig funktioniert?

Hier ist die fiddle

<div id="result" contenteditable="true"></div> 
<button class="click">click to add text</butto> 

---

var result = $('#result'); 
$('.click').click(function() { 
    var preHtml = result.html(); 
    result.html(preHtml + "hello"); 
    result.focus(); 
}); 

Ich versuchte setStart und setEnd Zugabe wie in diesem link aber keinen Nutzen erwähnt.

Answer 1

Ich habe die Lösung here dank Tim down :). Das Problem war, dass ich in der comments von jwarzech

placeCaretAtEnd($('#result')); 

Statt

placeCaretAtEnd(($('#result').get(0)); 

wie erwähnt Aufruf.

Working Fiddle