如何使用 contenteditable 将光标放在 div 标签中的文本末尾答案

【问题标题】：How to place cursor at the end of text in div tag with contenteditable如何使用 contenteditable 将光标放在 div 标签中的文本末尾
【发布时间】：2014-02-10 02:50:40
【问题描述】：

这里有很多解决方案

将光标置于input 或textbox 标记的文本末尾。

Use JavaScript to place cursor at end of text in text input element

jQuery Textbox Cursor to end of Text?

jQuery Set Cursor Position in Text Area

目前，我使用div 标签和contenteditable = "true"，而不是使用input 或textbox 标签。

不幸的是，即使我将 val 替换为 text 以使代码正常工作，它们都没有按预期工作。

有什么想法吗？谢谢。

【问题讨论】：

似乎所有引用的帖子都回答了您的问题？
它们相关，并且它们仅适用于 input 或 textbox 标签不适用于带有 contenteditable = "true" 的 div 标签

标签： javascript jquery html

【解决方案1】：

我发现了一个类似的问题，这看起来非常复杂。

Set cursor position on contentEditable <div>

虽然有人声称某些东西，但我使用过， Zane Claes 的回答，按预期工作。

$.fn.focusEnd = function() {
    $(this).focus();
    var tmp = $('<span />').appendTo($(this)),
        node = tmp.get(0),
        range = null,
        sel = null;

    if (document.selection) {
        range = document.body.createTextRange();
        range.moveToElementText(node);
        range.select();
    } else if (window.getSelection) {
        range = document.createRange();
        range.selectNode(node);
        sel = window.getSelection();
        sel.removeAllRanges();
        sel.addRange(range);
    }
    tmp.remove();
    return this;
}

【讨论】：

【解决方案2】：

在上述问题的所有解决方案之后，我给出了一个解决方案。输入文字并按回车光标移动到文字末尾，

JsFiddle

试试看，

$("div").keypress(function (event) {

    if (event.which == '13') {

        var val = $(this).text();    

        $(this).text('');
        $(this).text(val);
        setCursorToEnd($(this).get(0))

        event.preventDefault();
    }
});
function setCursorToEnd(ele)
  {

    var range = document.createRange();
    var sel = window.getSelection();
    range.setStart(ele, 1);
    range.collapse(true);
    sel.removeAllRanges();
    sel.addRange(range);
    ele.focus();
  }

【讨论】：

谢谢，事实上，我在这个问题之前已经尝试过这段代码，并且有一个错误Uncaught NotFoundError: An attempt was made to reference a Node in a context where it does not exist for range。
其实是的，而且还没有看到它的焦点或光标位置。
你按下回车键了吗？你需要按回车键。
无论如何，此代码不适用于我的项目。我现在将自己发布替代答案。