javascript - jQuery:如何关注DIV的最后一个字符

我有一个contenteditable分区。
我想把注意力集中在添加文本时的最后一个字符上。
HTML格式：

<div id="messageBox" contenteditable="true" class="message"></div>

我试过了，但这个密码不对：
JsFiddle
如何创建一个新行和光标焦点在那里？

最佳答案

您可以在一些javascript的帮助下完成这项工作。下面是一个将光标设置到文本末尾的示例
JSFiddle Link

<div id="messageBox" contenteditable="true" class="message"></div>
<input type='button' class='btn' value='button'>

function placeCaretAtEnd(el) {
    el.focus();
    if (typeof window.getSelection != "undefined"
            && typeof document.createRange != "undefined") {
        var range = document.createRange();
        range.selectNodeContents(el);
        range.collapse(false);
        var sel = window.getSelection();
        sel.removeAllRanges();
        sel.addRange(range);
    } else if (typeof document.body.createTextRange != "undefined") {
        var textRange = document.body.createTextRange();
        textRange.moveToElementText(el);
        textRange.collapse(false);
        textRange.select();
    }
}

$('.btn').click(function() {

    $('#messageBox').html('ok');

    placeCaretAtEnd($('#messageBox').get(0));
});