Question

我使用div [contenteditable = true]在wysiwyg编辑器上工作我想设置一个选择范围，从节点A的偏移量X到节点B的偏移量Y.我在Firefox和IE9上做得很好，代码是：

var range = document.createRange();
range.setStart(selectNode, 0);
range.setEnd(selectNode, selectNode.textContent.length);
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);

但是在IE8上，范围对象完全不同，它没有setStart / setEnd，并且选择对象没有remove / addRange内容。请帮忙，

Answer 1

看看rangy。它是一个跨浏览器范围/选择API。这可能就是你所需要的。

http://code.google.com/p/rangy/

Answer 2

我有一个类似的问题发现这个polyfill对我来说非常有用，因为我不能在我的情况下使用rangy： http://bl.ocks.org/visnup/3456262

编辑：原始链接确实已经死了。回顾一下我的旧代码，看起来polyfill从未进入发布代码，我们只需要进行如下功能检测：

if(window.getSelection || document.selection){

然后在mouseup上：

var range;
if(window.getSelection){
    var selection = window.getSelection();
    range = selection.getRangeAt(0);
} else if(document.selection){
    range = document.selection.createRange();
    if(!range.surroundContents){
        // then give up, feature not fully implemented
    }
}
// now do stuff with range (i.e. the selection)

...因此，该功能不支持IE8用户。

然而一切都没有丢失：如果你必须支持IE8，可能会有newer (than my original answer) polyfill on Github。它看起来既精简又全面。

在javascript IE8中设置选择范围

2 个答案: