Question

这里有很多解决方案

将光标放在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以使代码正常工作，但它们都没有按预期工作。

有什么想法？感谢。

Answer 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;
}

Answer 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();
  }

如何将光标放在div标签中带有contenteditable的文本末尾

2 个答案: