移动的JavaScript光标位置?(Move the cursor position with J

2019-06-24 21:08发布

我期待其当前位置之前的正是移动插入符号四个空格,这样我可以正确地插入一个标签。 我已经有在光标的位置工作的HTML插入,但是当我插入HTML,光标掉队。 我花了过去一小时左右寻找各种方式来做到这一点,我已经尝试过很多人,但我不能让任何人来为我工作。 下面是我试过的最新方法:

function moveCaret(input, distance) {
    if(input.setSelectionRange) {
        input.focus();
        input.setSelectionRange(distance, distance);
    } else if(input.createTextRange) {
        var range = input.createTextRange();
        range.collapse(true);
        range.moveEnd(distance);
        range.moveStart(distance);
        range.select();
    }
}

它也绝对没有什么 - doesn't移动插入符号,抛出任何错误或任何东西。 这让我百思不得其解。 是的,我知道,上面的方法集(应该)设置插入符从指定节点的开头一定的位置(也就是input ),但即使不工作。 那么,究竟我做错了,我怎么能做到这一点吗?


编辑:根据OV提供的链接,我已经成功地拼凑起来的东西是终于做的事情:抛出一个错误。 好极了! 下面是新的代码:

this.moveCaret = function(distance) {
    if(that.win.getSelection) {
        var range = that.win.getSelection().getRangeAt(0);
        range.setStart(range.startOffset + distance);
    } else if (that.win.document.selection) {
        var range = that.win.document.selection.createRange();
        range.setStart(range.startOffset + distance);
    }
}

现在,这给出了错误Uncaught Error: NOT_FOUND_ERR: DOM Exception 8 。 任何想法,为什么?

Answer 1:

你的代码片段是文字输入和文字区域,不contenteditable元素。

假如所有的内容是在一个单一的文本节点和选择中它完全包含,下面将在所有主要浏览器,包括IE 6。

演示: http://jsfiddle.net/9sdrZ/

码:

function moveCaret(win, charCount) {
    var sel, range;
    if (win.getSelection) {
        // IE9+ and other browsers
        sel = win.getSelection();
        if (sel.rangeCount > 0) {
            var textNode = sel.focusNode;
            var newOffset = sel.focusOffset + charCount;
            sel.collapse(textNode, Math.min(textNode.length, newOffset));
        }
    } else if ( (sel = win.document.selection) ) {
        // IE <= 8
        if (sel.type != "Control") {
            range = sel.createRange();
            range.move("character", charCount);
            range.select();
        }
    }
}


文章来源: Move the cursor position with Javascript?