Библиотека диапазона выбора Cross Browser?

Знает ли кто-нибудь о каких-либо библиотеках диапазонов выбора браузера, написанных на javascript?

Я нашел несколько плагинов jQuery (которые, откровенно говоря, слишком ограничены и очень ошибочны). Я уже реализовал и использую следующие, чтобы снять некоторые из моих трюков:

http://plugins.jquery.com/project/wrapSelection http://perplexed.co.uk/1020_text_selector_jquery_plugin.htm

И еще несколько небольших скриптов и т.д.

Я просто хотел бы узнать, что вы обнаружили там. Не отправляйте меня снова в эту игру (я потратил дни, работая над всем этим). Надеюсь, это может быть, когда будущие программисты могут найти ответ.

Ответ 1

Я разработал кросс-браузерную библиотеку диапазона и выбора, называемую Rangy. Его ядро не отличается по своей концепции до IERange, но выходит за его рамки с точки зрения реализации спецификаций выбора уровня DOM уровня 2 и HTML5, а также с точки зрения стабильности и обходных путей для ошибок браузера. Я думаю, что это лучшее, что есть там.

Существуют также дополнительные модули для сохранения, восстановления и сериализации выбора и применения класса CSS к диапазонам и выборам.

https://github.com/timdown/rangy

Далее используются некоторые расширения 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);

Ответ 2

Для опции плагина jQuery есть jCaret, вы можете проверить здесь здесь и примеры здесь.

Я использовал это в нескольких проектах для различных приложений, хорошо разбираюсь в устранении несогласованности между браузерами.

Ответ 3

Для работы с диапазоном общего назначения (в отличие от обработки ввода/обработки текстовой области) рассмотрите ierange. Попытка реализовать стандартную модель диапазона DOM уровня 2, поддерживаемую другими браузерами в IE. Вид работ.