javascript - 如何使用 jquery/javascript 在 div 中获取选择

Question

有很多代码可以在页面中进行选择， 但我想要一个代码来在 div 中进行选择， 如果选择在我的 div 之外，该函数必须返回空字符串；

有一个 jquery 插件只适用于 textarea 但不适用于 div。 (here)

谢谢

Answer 1

由于长篇大论的边界比较以及 IE 采用与其他浏览器不同的方法，但在所有主流浏览器中都适用，所以这有点冗长。它还处理 Firefox 中的多项选择。

jsFiddle:http://jsfiddle.net/Q982A/2/

代码:

function getSelectedTextWithin(el) {
    var selectedText = "";
    if (typeof window.getSelection != "undefined") {
        var sel = window.getSelection(), rangeCount;
        if ( (rangeCount = sel.rangeCount) > 0 ) {
            var range = document.createRange();
            for (var i = 0, selRange; i < rangeCount; ++i) {
                range.selectNodeContents(el);
                selRange = sel.getRangeAt(i);
                if (selRange.compareBoundaryPoints(range.START_TO_END, range) == 1 && selRange.compareBoundaryPoints(range.END_TO_START, range) == -1) {
                    if (selRange.compareBoundaryPoints(range.START_TO_START, range) == 1) {
                        range.setStart(selRange.startContainer, selRange.startOffset);
                    }
                    if (selRange.compareBoundaryPoints(range.END_TO_END, range) == -1) {
                        range.setEnd(selRange.endContainer, selRange.endOffset);
                    }
                    selectedText += range.toString();
                }
            }
        }
    } else if (typeof document.selection != "undefined" && document.selection.type == "Text") {
        var selTextRange = document.selection.createRange();
        var textRange = selTextRange.duplicate();
        textRange.moveToElementText(el);
        if (selTextRange.compareEndPoints("EndToStart", textRange) == 1 && selTextRange.compareEndPoints("StartToEnd", textRange) == -1) {
            if (selTextRange.compareEndPoints("StartToStart", textRange) == 1) {
                textRange.setEndPoint("StartToStart", selTextRange);
            }
            if (selTextRange.compareEndPoints("EndToEnd", textRange) == -1) {
                textRange.setEndPoint("EndToEnd", selTextRange);
            }
            selectedText = textRange.text;
        }
    }
    return selectedText;
}

或者，您可以使用我的 Rangy库，代码变为:

function getSelectedTextWithin(el) {
    var selectedText = "";
    var sel = rangy.getSelection(), rangeCount = sel.rangeCount;
    var range = rangy.createRange();
    range.selectNodeContents(el);
    for (var i = 0; i < rangeCount; ++i) {
        selectedText += sel.getRangeAt(i).intersection(range);
    }
    return selectedText;
}