代码之家 › 专栏 › 技术社区 › sagarkothari

如何检测用户是否在HTML和JavaScript中选择了整个文档?

range dom html javascript

sagarkothari · 技术社区 · 15 年前

我正在为iPhone Safari开发一个离线网页。

function highlight() {

    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.getRangeAt) {
            range = sel.getRangeAt(0);
        }
        document.designMode = "on";
        if (range) {
            sel.removeAllRanges();
            sel.addRange(range);
        }        
        document.execCommand("HiliteColor", false, "yellow");       
        document.designMode = "off";
    }
}

这对于正常的选择是非常有效的。

编辑:

怎么办?

3 回复 | 直到 8 年前

Tim Down 15 年前

下面是一个函数,该函数将返回一个布尔值,指示指定元素的所有内容是否都已选定,并在所有主要浏览器(包括IE)中都有效 document.body

function areElementContentsSelected(el) {
    var range, elRange;
    if (window.getSelection && document.createRange) {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            elRange = document.createRange();
            elRange.selectNodeContents(el);
            for (var i = 0, len = sel.rangeCount; i < len; ++i) {
                range = sel.getRangeAt(i);
                if (range.compareBoundaryPoints(range.START_TO_START, elRange) <= 0 && range.compareBoundaryPoints(range.END_TO_END, elRange) >= 0) {
                    return true;
                }
            }
        }
    } else if (document.selection && document.selection.createRange && document.selection.type == "Text") {
        range = document.selection.createRange();
        elRange = range.duplicate();
        elRange.moveToElementText(el);
        return range.compareEndPoints("StartToStart", elRange) <= 0 && range.compareEndPoints("EndToEnd", elRange) >= 0;
    }
    return false;
}

alert( areElementContentsSelected(document.body) );