.focus() - 如何使用contentEditable div将光标放在内容的末尾

时间:2014-12-27 15:27:27

标签: javascript jquery contenteditable

下午,

我有一个内容可编辑的div,在上传之后附加一些图像之后,我希望能够集中注意力,用户可以继续输入而无需点击返回div。

令我惊讶的是,

.focus();

工作,但是把光标放在文本的开头,是否可以将光标放在最后?

JSFiddle:http://jsfiddle.net/mxtasnbL/

备份代码:

<div class="textarea" contenteditable="true"></div>

var div = $(".textarea");
div.append('Some text before an image <br><img class="temp_added_image" src="http://www.deshow.net/d/file/car/2010-10/seat-electric-car-879-2.jpg"><br><br>');
div.focus();

1 个答案:

答案 0 :(得分:2)

一种方法是使用从您想要插入符号的位置开始的选择范围:

var sel = window.getSelection(), range = sel.getRangeAt(0);
range.setStartBefore(div.children().last()[0]);
sel.removeAllRanges();
sel.addRange(range);

更新了小提琴:http://jsfiddle.net/techfoobar/mxtasnbL/2/