Ранги исправить границы

При выделении текста есть некоторые различия в том, где именно начинается и заканчивается выделение, так как иногда оно начинается в конце предыдущего элемента, а иногда - в начале текстового узла. Я пытаюсь нормализовать это так, чтобы он всегда начинался в начале элемента, содержащего текст, и заканчивался в конце элемента, содержащего текст, и делал его согласованным во всех браузерах.

например <b>mouse></b><i>cat</i>

При выборе "cat", chrome всегда, кажется, делает правильные вещи и возвращает выбор с помощью startContainer cat и startOffset 0. Firefox, а иногда IE8 часто запускается в конце предыдущего элемента (мыши) с помощью startOffset 5

Моя грубая попытка исправить это не удалась:

  var sr=rangy.getSelection().getRangeAt(0);
  var sc=sr.startContainer;
  if(sc.nodeType!=3||sr.startOffset==sc.length)
    {
    sr.setStartAfter(sc);   //move start to next node in range
    }
  rangy.getSelection().setSingleRange(sr);
  console.log(sr.inspect());

Что мне не хватает?

1 ответ

Решение

Хорошо, я думаю, что взломал это, но я очень открыт для комментариев или предложений о том, как улучшить это. Как-то не хватает элегантности, и я чувствую, что должен быть лучший путь. Проблема, похоже, требует исправления в Firefox. Похоже, что Chrome и IE8 никогда не выделяют за пределы элемента, в котором содержится текст. В любом случае, это то, что мне подходит. (до сих пор)

var sr=rangy.getSelection().getRangeAt(0);
var sc=sr.startContainer,ec=sr.endContainer;
if(sc.nodeType!=3||sr.startOffset==sc.length)
  {
  sc=(sc.nextSibling)?sc.nextSibling:sc.parentNode.nextSibling;
  if(sc.nodeType!=3)sc=sc.firstChild;
  sr.setStart(sc,0);
  }
if(ec.nodeType!=3||sr.endOffset==0)
  {
  ec=(ec.previousSibling)?ec.previousSibling:ec.parentNode.previousSibling;
  if(ec.nodeType!=3)ec=ec.lastChild;
  sr.setEnd(ec,ec.length);
 }
rangy.getSelection().setSingleRange(sr);
console.log(sr.inspect());
Другие вопросы по тегам