Определить направление выбора пользователя с помощью javascript

Я эмулирую текстовый редактор в своем проекте с помощью специального каретки, но на свой выбор. Есть ли способ определить, в каком направлении пользователь выбирает текст? Допустим, пользователь выбрал текст "hello world". Есть две возможности: он может начать с щелчка мышью по букве "d" и заканчивается буквой "h", или он может начинать с буквы "h" и заканчивать буквой "d". Есть ли простой способ, как отличить эти две ситуации? Спасибо.

Ответ 1

Старый вопрос, но я подумал, что добавлю более простое решение:

var sel = getSelection(),
position = sel.anchorNode.compareDocumentPosition(sel.focusNode),
backward = false;
// position == 0 if nodes are the same
if (!position && sel.anchorOffset > sel.focusOffset || 
  position === Node.DOCUMENT_POSITION_PRECEDING)
  backward = true;

Node.compareDocumentPosition(MDN)

Ответ 2

Насколько я знаю, для Javascript нет свойства или события, которые будут сообщать вам об этом. Этот сайт описывает, как отслеживать направление мыши, вы можете настроить его на свои нужды.

По существу, до тех пор, как вы можете получить позицию мыши (либо loc.pageX или Y, или event.clientX или Y), то вы можете написать свои собственные функции, чтобы отслеживать направление, основываясь на положении и времени.

В вашем случае вы, вероятно, захотите зафиксировать это, когда пользователь имеет текст "выбран", то есть в событии mousedown.

Ответ 3

отследить мультияунгу X offet, а затем смещение X мыши, и результат показывает направление: (используя jQuery)

var textSelectionDirection = (function(){
    var direction = '', mouseDownOffset = null;

    function getDirection(e){
        if( e.type == 'mousedown' )
            mouseDownOffset = e.clientX;
        else if( e.type == 'mouseup' ){
            direction = e.clientX < mouseDownOffset ? 'left' : 'right';
            console.log(direction);
        }
    }

    return getDirection
})();

$(document).on('mousedown mouseup', textSelectionDirection);

DEMO: http://jsfiddle.net/ffumv/

Ответ 4

Это должно работать:

function isBackwards(sel) {
  var rg = document.createRange();
  rg.setStart(sel.anchorNode, sel.anchorOffset);
  rg.setEnd(sel.focusNode, sel.focusOffset);
  return !rg.toString();
}

Примечание. Если вы разрешаете выбор только разрывов и пробелов, вам нужно изменить вышеприведенную функцию, так как она вернет true в таком случае, независимо от того, что.

Ответ 5

Я пытался найти решение, которое работает для меня на пару дней. Вот что я придумал, это будет работать с одним выбором диапазона:

var selection = window.getSelection();
var range = selection.getRangeAt(0);
var isSelectionDown = selection.focusNode === range.endContainer;
var isSelectionUp = selection.focusNode === range.startContainer;

Фокус node выбора всегда находится там, где пользователь освобождает мышь, но конечные и начальные контейнеры диапазона меняются в зависимости от направления.