Переместить позицию курсора с помощью Javascript?

Я рассчитываю переместить каретку ровно на четыре пробела вперед от ее текущего положения, чтобы я мог правильно вставить вкладку. Я уже получил вставку 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();
    }
}

Он абсолютно ничего не делает - не перемещает каретку, не выдает никаких ошибок или чего-либо еще. Это оставляет меня сбитым с толку. И да, я знаю, что вышеупомянутый метод устанавливает (должен) установить каретку в определенной позиции от начала указанного узла (то естьinput), но даже это не работает. Итак, что именно я делаю не так, и как я могу сделать это правильно?

Изменить: на основе ссылок, которые o.v. при условии, что мне удалось собрать воедино что-то, что наконец-то что-то делает: выдает ошибку. Ура! Вот новый код:

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, Есть идеи почему?

 o.v.28 мая 2012 г., 02:55
Возможный дубликат:stackoverflow.com/questions/1181700/… This а такжеthis ответ, кажется, получил большое признание.
 Fabrício Matté28 мая 2012 г., 02:51
Единственная версия IE, с которой я тестирую, - это IE9, но удачи. :)
 Fabrício Matté28 мая 2012 г., 02:49
Вы пытались установитьelement.selectionStart а такжеelement.selectionEnd? Насколько я помню, должен работать кросс-браузерный ввод и текстовые сообщения.
 Elliot Bonneville28 мая 2012 г., 02:50
Я избегал этого, потому что считаю, что он не работает в более ранних версиях IE8. Я все равно посмотрю на это.
 Elliot Bonneville28 мая 2012 г., 02:52
Да, казалось быselectionStart не работает в более ранних версиях IE, но все равно спасибо. знак равно

Ответы на вопрос(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();
        }
    }
}
 01 июл. 2016 г., 15:47
@ danm07: Какое объяснение ты хочешь? Методы выбора и диапазона являются стандартными и хорошо документированы. Код короткий и простой. Кроме того, если вы хотите аннотировать его комментариями, вы можете сделать это. Единственные комментарии, которые, по моему мнению, могут быть полезны, - это ярлыки для двух основных ветвей кода (IE 9+ и другие браузеры, IE 6-8).
 05 июл. 2016 г., 18:31
@ danm07: Я виновен в сотнях ответов. Я не думаю, что это универсальная практика добавлять текущие комментарии ко всему коду на SO; Я не уверен, думаю ли я, что это должно быть. Побуждает ли больше людей удерживать в руках людей поиск API-интерфейсов браузера, которые я здесь использовал? Я не знаю. Во всяком случае, я добавил немного подробностей в этот ответ.
 01 июл. 2016 г., 21:58
Предоставление заранее сделанного решения мало что делает для заполнения пробелов в знаниях. Было бы хорошо, если бы вы указали, что пошло не так в коде спрашивающего, я уверен, что это этикет стеков.
 03 февр. 2014 г., 20:23
+1, потому что это действительно полезный фрагмент кода. Просто вопрос: почему вы получаете доступ к глобальному через аргумент win?
 18 нояб. 2015 г., 15:20
Однако, если вам нужно перейти к предыдущему текстовому узлу, это не так, какsel.focusNode == 0

Ваш ответ на вопрос