Ответы пользователя по тегу JavaScript
  • Определить расположение текстового курсора в div editable?

    @egorp

    Существует плагин jquery.caret (http://plugins.jquery.com/caret/) который позволяет простым вызовом
    var position = $("#myeditable").caret();
    получить положение курсора внутри editable div. Плагин маленький, ~60 строк, и в нем несложно разобраться.

    Однако, он определяет положение относительно текста.
    Если вам нужно проверить, например, что курсор попал в заданный span, то топорный способ — обходить все текстовые узлы до тех пор пока их суммарная длина не станет больше чем позиция курсора.

    Сделать это можно с помощью createTreeWalker

    function getTextNodeByCaret(caret) {
      var len = 0;
      var walk = document.createTreeWalker($("#myeditable")[0], NodeFilter.SHOW_TEXT, null, false);
      var last;
      var node;
      while ((node = walk.nextNode())) {
        last = node;
        if ((len += node.textContent.length) >= caret) {
          return node;
        }
      }
      return last;
    }

    Ответ написан
    Комментировать