在网上找了好久，终于解决了这个问题。这里记录一下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>测试</title>
<!-- 引入jQuery -->
<script type="text/javascript" src="assets/js/jquery-1.12.4.min.js"></script>
<style type="text/css">
#div {
border: 1px solid gray;
width: 800px;
height: 41px;
}
</style>
</head>
<body>
<div id="div" contenteditable="true">点击按钮把图片拼接过来...</div>
<button id="btn" onclick="btnClick()">光标聚焦到最后</button>
<script type="text/javascript">
function btnClick() {
//创建一个图片元素
var img = document.createElement('img');
img.src = '//www.baidu.com/img/baidu_jgylogo3.gif';
//把图片放到div里，并让光标聚焦到内容最后
var div = document.getElementById('div');
div.appendChild(img);
//这里如果使用"div.focus()"，则光标总是出现在最前面
focusEnd(div);
}
//将光标聚焦到可编辑div内容末尾(el为DOM对象)
function focusEnd(el){
el.focus();
if($.support.msie) {
var range = document.selection.createRange();
this.last = range;
range.moveToElementText(el);
range.select();
document.selection.empty(); //取消选中
} else {
var range = document.createRange();
range.selectNodeContents(el);
range.collapse(false);
//返回一个Selection对象，表示用户选择的文本范围或光标的当前位置
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
}
}
</script>
</body>
</html>
参考链接：http://www.cnblogs.com/jonie-wong/p/5519822.html
![reactnative在文本框光标处插入文字的实现方法[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)