jQuery在文本区域中设置光标位置

这里的解决方案是正确的,除了jQuery扩展代码.

扩展函数应迭代每个选定的元素并返回this支持链接.这是在 一个正确的版本:

$.fn.setCursorPosition = function(pos) {
  this.each(function(index, elem) {
    if (elem.setSelectionRange) {
      elem.setSelectionRange(pos, pos);
    } else if (elem.createTextRange) {
      var range = elem.createTextRange();
      range.collapse(true);
      range.moveEnd('character', pos);
      range.moveStart('character', pos);
      range.select();
    }
  });
  return this;
};

我发现了一个适合我的解决方案:

$.fn.setCursorPosition = function(position){
    if(this.length == 0) return this;
    return $(this).setSelection(position, position);
}

$.fn.setSelection = function(selectionStart, selectionEnd) {
    if(this.length == 0) return this;
    var input = this[0];

    if (input.createTextRange) {
        var range = input.createTextRange();
        range.collapse(true);
        range.moveEnd('character', selectionEnd);
        range.moveStart('character', selectionStart);
        range.select();
    } else if (input.setSelectionRange) {
        input.focus();
        input.setSelectionRange(selectionStart, selectionEnd);
    }

    return this;
}

$.fn.focusEnd = function(){
    this.setCursorPosition(this.val().length);
            return this;
}

现在,您可以通过调用将焦点移动到任何元素的结尾:

$(element).focusEnd();

这适用于Mac OSX上的Safari 5,jQuery 1.4:

$("Selector")[elementIx].selectionStart = desiredStartPos; 
$("Selector")[elementIx].selectionEnd = desiredEndPos;

我确实意识到这是一篇非常古老的帖子,但我认为我应该提供一个更简单的解决方案来仅使用jQuery来更新它.

function getTextCursorPosition(ele) {   
    return ele.prop("selectionStart");
}

function setTextCursorPosition(ele,pos) {
    ele.prop("selectionStart", pos + 1);
    ele.prop("selectionEnd", pos + 1);
}

function insertNewLine(text,cursorPos) {
    var firstSlice = text.slice(0,cursorPos);
    var secondSlice = text.slice(cursorPos);

    var new_text = [firstSlice,"\n",secondSlice].join('');

    return new_text;
}

使用ctrl-enter添加新行的用法(如在Facebook中):

$('textarea').on('keypress',function(e){
    if (e.keyCode == 13 && !e.ctrlKey) {
        e.preventDefault();
        //do something special here with just pressing Enter
    }else if (e.ctrlKey){
        //If the ctrl key was pressed with the Enter key,
        //then enter a new line break into the text
        var cursorPos = getTextCursorPosition($(this));                

        $(this).val(insertNewLine($(this).val(), cursorPos));
        setTextCursorPosition($(this), cursorPos);
    }
});

我很乐意批评.谢谢.

更新:此解决方案不允许正常的复制和粘贴功能(即ctrl-c,ctrl-v),所以我将来必须编辑它以确保该部分再次工作.如果你知道如何做到这一点,请在这里评论,我很乐意测试它.谢谢.

我正在使用这个:http://plugins.jquery.com/project/jCaret

在IE中将光标移动到某个位置,这段代码就足够了:

var range = elt.createTextRange();
range.move('character', pos);
range.select();

在将文本插入textarea之前设置焦点？

$("#comments").focus();
$("#comments").val(comments);

这适用于我的铬

$('#input').focus(function() {
    setTimeout( function() {
        document.getElementById('input').selectionStart = 4;
        document.getElementById('input').selectionEnd = 4;
    }, 1);
});

显然你需要延迟一微秒或更长时间,因为通常用户通过点击文本字段中的某个位置(或通过点击标签)来关注文本字段,因此你必须等到位置是由用户设置单击,然后更改它.