getSelection без атрибута alt и скриптов в нем? - PullRequest
3 голосов
/ 31 августа 2011

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

ПРИМЕР:

<img src="someSrc.jpg" alt="image_alt" /> My text here ... 

, если я тоже выберу изображение, оно возвращает

image_alt Мой текст здесь ...

Но мне нужно только

Мой текст здесь ...

Есть ли способполучить только текст, без alt?

Большое спасибо

Ответы [ 2 ]

7 голосов
/ 31 августа 2011

Попробуйте это:

window.getTextSelection = function() {
    //First get HTML Fragment of selection
    var html = window.getSelection().getRangeAt(0).cloneContents(); 
    //Return only the text
    return html.textContent||html.innerText;
}

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

img {
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -o-user-select: none;
        user-select: none;
}
1 голос
/ 31 августа 2011

Самый простой способ - использовать toString() метод Range (ов) выделения, что именно то, что window.getSelection().toString() указано делать в текущей версии новой спецификации Range WHATWG (хотя это противоречит тому, что делают некоторые браузеры и может изменяться или не изменяться).Следующее будет работать с несколькими выбранными диапазонами (которые поддерживает Mozilla), а также в IE <9. </p>

jsFiddle: http://jsfiddle.net/timdown/HkP2S/

Код:

function getSelectionRangeText() {
    var selText = "";
    if (window.getSelection) {
        var sel = window.getSelection(), rangeCount = sel.rangeCount;
        if (rangeCount) {
            for (var i = 0, rangeTexts = []; i < rangeCount; ++i) {
                rangeTexts.push("" + sel.getRangeAt(i));
            }
            selText = rangeTexts.join("");
        }
    } else if (document.selection && document.selection.type == "Text") {
        selText = document.selection.createRange().text;
    }
    return selText;
}

ОБНОВЛЕНИЕ

Это решение включает текст внутри элементов <script> и <style>.Чтобы удалить это, вы можете использовать cloneContents() в диапазонах выбора и проходить через DOM полученных фрагментов документа, собирая текст только из текстовых узлов, не содержащихся в элементах <script> и <style>.Вы также можете расширить это, чтобы удалить текст, который находится внутри элементов с помощью CSS display: none.

jsFiddle: http://jsfiddle.net/timdown/HkP2S/2/

Код:

function getSelectionRangeText() {
    var selText = "", selTextParts = [];

    function getNodeText(node) {
        if (node.nodeType == 3) {
            selTextParts.push(node.data);
        } else if (node.hasChildNodes()
        && !(node.nodeType == 1 && /^(script|style)$/i.test(node.tagName))) {
            for (var child = node.firstChild; !!child; child = child.nextSibling) {
                getNodeText(child);
            }
        }
    }

    if (window.getSelection) {
        var sel = window.getSelection(), rangeCount = sel.rangeCount;
        if (rangeCount) {
            for (var i = 0; i < rangeCount; ++i) {
                getNodeText(sel.getRangeAt(i).cloneContents());
            }
            selText = selTextParts.join("");
        }
    } else if (document.selection && document.selection.type == "Text") {
        selText = document.selection.createRange().text;
    }
    return selText;
}
...