Question

选择文本时，选择开始和结束的确切位置会有一些变化，有时它会在前一个元素的末尾开始，有时在textnode的开头。我正在尝试对其进行规范化，因此它始终从包含文本的元素的开头开始，并在包含文本的元素的末尾结束，并使其在浏览器中保持一致。

e.g。 <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());

我错过了什么？

Answer 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());

rangy修复边界

1 个答案: