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