Получить позицию курсора в contenteditable div - PullRequest
Новая
       41

Получить позицию курсора в contenteditable div

1 голос
/ 07 декабря 2010

Я нашел следующий код здесь на SO, чтобы получить позицию курсора contenteditable div, однако он всегда возвращает 0.

Функция, которая должна получить позицию: 

new function($) {
    $.fn.getCursorPosition = function() {
        var pos = 0;
        var input = $(this).get(0);
        // IE Support
        if (document.selection) {
            input.focus();
            var sel = document.selection.createRange();
            var selLen = document.selection.createRange().text.length;
            sel.moveStart('character', -input.value.length);
            pos = sel.text.length - selLen;
        }
        // Firefox support
        else if (input.selectionStart || input.selectionStart == '0')
            pos = input.selectionStart;

        return pos;
    }
} (jQuery);

Код, который я использую для проверки: 

$('div.MESSAGE_OF_DAY').keyup(function() {
  alert($(this).getCursorPosition()); // always returns 0???
});

Я использую Chrome (8.0.552.215), если это имеет значение.

1 Ответ

8 голосов
/ 10 декабря 2010

Функция, которую вы нашли, предназначена для поиска каретки или выделения на входе или в текстовой области, а не как элемент contenteditable.Положение границы каретки / выбора может быть получено в терминах узла DOM и смещения в этом узле с использованием объекта браузера Selection для получения Range.Я предлагаю прочитать об этих объектах (ссылки, которые я предоставил, являются хорошей отправной точкой).В Internet Explorer этот процесс совершенно другой, но вы можете использовать мою библиотеку Rangy , чтобы устранить различия.

...