Question

在现代浏览器上的内容可编辑的div上运行window.getSelection().getRangeAt(0)时，可以正常工作，在某些情况下，Internet Explorer会引发“ IndexSizeError”异常。

当Selection对象的AnchorNode是TextNode而不是HTML节点时会发生。

我想也许我会为此找到一个polyfill，但是似乎不存在。

是否有快速解决方案或使用getRangeAt()的替代方案？

Answer 1

我发现Safari Mobile也会发生同样的事情： IndexSizeError: The index is not in the allowed range.

我发现了有关此帖子： Creating a Range object from a Selection object on Safari

使用以下代码：

var rangeObject = getRangeObject(userSelection);

function getRangeObject(selectionObject) {
    if (selectionObject.getRangeAt)
        return selectionObject.getRangeAt(0);
    else { // Safari!
        var range = document.createRange();
        range.setStart(selectionObject.anchorNode,selectionObject.anchorOffset);
        range.setEnd(selectionObject.focusNode,selectionObject.focusOffset);
        return range;
    }
}

经过调整后，我的需要：

    var range = document.createRange();
        if(selectionObject.anchorNode) {
          range.setStart(selectionObject.anchorNode ,selectionObject.anchorOffset);
          range.setEnd(selectionObject.focusNode,selectionObject.focusOffset);
        } 
        else {
          range.setStart(div_element ,selectionObject.anchorOffset);
          range.setEnd(div_element, selectionObject.focusOffset);           
        }

该条件适用于div为空且anchorNode为null的情况-因此，在这种情况下，它应使用div_element本身。如果存在anchorNode（包括TextNode类型），则第一部分在IE和safary mobile上也能很好地工作。

在IE

1 个答案: