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

【问题标题】：.focus() - how to put the curser at end of content using contentEditable div.focus() - 如何使用 contentEditable div 将光标放在内容的末尾
【发布时间】：2014-12-27 15:27:26
【问题描述】：

下午，

我有一个内容可编辑的 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();

【问题讨论】：

重复：stackoverflow.com/questions/19568041/…

标签： javascript jquery contenteditable

【解决方案1】：

一种方法是使用从您希望插入符号所在位置开始的选择范围：

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/

【讨论】：