Question

有没有人知道用javascript编写的任何跨浏览器用户选择范围库？

我找到了一些jQuery插件，（坦率地说这些插件过于局限且非常错误）。

我想知道你在那里发现了什么。不要再向我发送谷歌搜索，（我花了几天时间研究这一切）。希望这可以成为未来程序员可以找到答案的地方。

Answer 1

我开发了一个名为Rangy的跨浏览器范围和选择库。它的核心在概念上与IERange没有什么不同，但在DOM 2级Range和HTML5选择规范的实现方面，以及浏览器错误的稳定性和变通方面方面都超越了它。我认为那是最好的。

还有额外的模块可用于保存，恢复和序列化选择以及将CSS类应用于范围和选择。

以下使用Ranges的一些Rangy扩展来轻松迭代选择中的文本节点并围绕每个文本节点：

function surroundSelectedText(templateElement){
    var range, sel = rangy.getSelection();
    var ranges = sel.getAllRanges();
    var textNodes, textNode, el, i, len, j, jLen;
    for (i = 0, len = ranges.length; i < len; ++i) {
        range = ranges[i];
        // If one or both of the range boundaries falls in the middle
        // of a text node, the following line splits the text node at the
        // boundary
        range.splitBoundaries();

        // The first parameter below is an array of valid nodeTypes
        // (in this case, text nodes only)
        textNodes = range.getNodes([3]);

        for (j = 0, jLen = textNodes.length; j < jLen; ++j) {
            textNode = textNodes[j];
            el = templateElement.cloneNode(false);
            textNode.parentNode.insertBefore(el, textNode);
            el.appendChild(textNode);
        }
    }
}

var span = document.createElement("span");
span.style.color = "green";
span.style.fontWeight = "bold";

surroundSelectedText(span);

Answer 2

对于jQuery插件选项，有jCaret，你可以查看homepage here和examples here。

我已经在一些项目中使用它来处理各种应用程序，可以很好地消除跨浏览器的不一致性。

Answer 3

对于通用范围工作（与输入/文本区选择处理相反），请考虑ierange。尝试实现IE中其他浏览器支持的标准DOM Level 2 Range模型。善良的作品。

跨浏览器选择范围库？

3 个答案: