Getselection Without Alt Attribute And Scripts In It?

I'm using window.getSelection () to get the selected text. But, if i select an image too, it returns also altof an image. EXAMPLE: M

Solution 1:

Try this:

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

In some cases you can simply disable the user selection via CSS: May you also can achieve this by disabling user-select for images:

img {
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -o-user-select: none;
        user-select: none;
}

Solution 2:

The easiest way would be to use the toString() method of selection's Range(s), which is what window.getSelection().toString() is specified to do in the current version of WHATWG's new Range spec (although this is contrary to what some browsers do and may or may not change). The following will work with multiple selected ranges (which Mozilla supports) and also in IE < 9.

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

Code:

functiongetSelectionRangeText() {
    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("");
        }
    } elseif (document.selection && document.selection.type == "Text") {
        selText = document.selection.createRange().text;
    }
    return selText;
}

UPDATE

This solution includes text inside <script> and <style> elements. To remove this, you could use cloneContents() on the selection ranges and traverse the DOM of the resulting document fragments, collecting text only from text nodes not contained within <script> and <style> elements. You could also expand on this to remove text that is inside elements with CSS display: none.

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

Code:

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

    functiongetNodeText(node) {
        if (node.nodeType == 3) {
            selTextParts.push(node.data);
        } elseif (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("");
        }
    } elseif (document.selection && document.selection.type == "Text") {
        selText = document.selection.createRange().text;
    }
    return selText;
}