Question

我认为这是一件非常简单的事情，但我无法让它发挥作用。我使用以下代码但没有成功。我知道这不起作用，即我正在使用chrome。这是一个jsFiddle来演示。感谢

$('#ta').focus(function(){
  this.selectionStart = this.value.length;
});

Answer 1

这是一个跨浏览器和jQuery兼容的解决方案（它支持给定选择器中的多个元素）。

在Chrome 40x，IE 11和FireFox 34x中测试

$("textarea").focus(function () {
    for (var i = 0; i < $(this).length; i++) {
        var el = $(this)[i]
        window.setTimeout(function () {
            if (el !== null) {
                if (el.createTextRange) {
                    var range = el.createTextRange();
                    range.move('character', el.value.length);
                    range.select();
                }
                else {
                    if (el.selectionStart || el.selectionStart === 0) {
                        el.focus();
                        el.setSelectionRange(el.value.length, el.value.length);
                    }
                    else {
                        el.focus();
                    }
                }
            }
        }, 1)
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<textarea id="ta">focus on me</textarea><br />
<textarea id="ta2">focus on me</textarea>

Answer 2

万一你想看看如何修复原始解决方案，以便它可以工作，这就是你必须做的事情：

$('#ta').focus(function (e) {
    var element = this;
    setTimeout(function () {
        element.selectionStart = element.value.length;
    }, 1);
});

必须在非常短的延迟后设置位置（在我的情况下1毫秒就足够了），因为好像光标位置设置为在焦点功能完成后单击的位置，所以你将光标设置在输入的末尾，然后立即将它放在用户点击后的位置

小提琴：http://jsfiddle.net/zb5uoL3t/

Answer 3

快点

$('#ta').focus(function(){
    moveCursorToEnd(document.getElementById('ta'));
});

function moveCursorToEnd(el) {
    if (typeof el.selectionStart == "number") {
        el.selectionStart = el.selectionEnd = el.value.length;
    } else if (typeof el.createTextRange != "undefined") {
        el.focus();
        var range = el.createTextRange();
        range.collapse(false);
        range.select();
    }
}

http://jsfiddle.net/9xaxz53x/1/

将插入符号移到textarea的焦点上

3 个答案: