将插入符号位置始终设置为contenteditable div [英] Set the caret position always to end in contenteditable div

问题描述

在我的项目中，我试图将插入符的位置始终放在文本的末尾。我知道这是默认行为，但是当我们动态地添加一些文本时，插入符号位置会变成Chrome和Firefox的起始点（IE很好，很棒）。

In my project, I am trying to set the caret position always to the end of the text. I know this is default behaviour but when we add some text dynamically, then the caret position changes to starting point in Chrome and firefox (IE is fine, amazing).

无论如何，要使它在Chrome和Firefox中正常工作？

Anyway to make it to work properly in chrome and firefox?

以下是 小提琴

Here is the 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();
});

我尝试添加 setStart 和 setEnd ，如链接所述，但没有用处。

I tried adding setStart and setEnd as mentioned in this link but no use.

推荐答案

我得到了解决方案此处感谢蒂姆下来:)。问题是我打电话给
$ b $

I got the solution here thanks to Tim down :). The problem was that I was calling

placeCaretAtEnd($('#result'));

而不是

Instead of

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

正如jwarzech在评论。

as mentioned by jwarzech in the comments.

工作小提琴

这篇关于将插入符号位置始终设置为contenteditable div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！