获取特定div中的所选HTML

问题描述：

我找到了一个代码段(不记得在哪里)，并且可以正常工作-差不多:-)

I have found a code snippet (can't remember where), and it's working fine - almost :-)

问题是，无论选择在整个网站上的什么位置，它都会复制选择，并且仅在特定的div中才必须复制选择-但这是怎么做的?

The problem is, that it copies the selection no matter where the selection is made on the entire website, and it must only copy the selection if it is in a specific div - but how is that done?

function getHTMLOfSelection () {
    var range;
    if (document.selection && document.selection.createRange) {
        range = document.selection.createRange();
        return range.htmlText;
    }
    else if (window.getSelection) {
        var selection = window.getSelection();
        if (selection.rangeCount > 0) {
            range = selection.getRangeAt(0);
            var clonedSelection = range.cloneContents();
            var div = document.createElement('div');
            div.appendChild(clonedSelection);
            return div.innerHTML;
        } else {
            return '';
        }
    } else {
        return '';
    }
}

$(document).ready(function() {
    $("#test").click(function() {
        var kopitekst = document.getElementById("replytekst");
        var kopitjek=getHTMLOfSelection(kopitekst);
        if (kopitjek=='')
        {
            alert("Please select some content");
        }
        else
        {
            alert(kopitjek);
        }
    });
});

我制作了 Jsfiddle

这是我在这里的第一篇文章.希望我做对了:-)

This is my first post here. Hopefully I done it right :-)

答

如果您可能的话，我建议使用

If it possible for you I recommend to use rangy framework. Then your code might look like this:

// get the selection
var sel = rangy.getSelection();
var ranges = sel.getAllRanges();
if (!sel.toString() || !sel.toString().length)
    return;

// create range for element, where selection is allowed
var cutRange = rangy.createRange();  
cutRange.selectNode(document.getElementById("replytekst"));

// make an array of intersections of current selection ranges and the cutRange
var goodRanges = [];
$.each(ranges, function(j, tr) {
    var rr = cutRange.intersection(tr);
    if (rr)
        goodRanges.push(rr);
});
sel.setRanges(goodRanges);

// do what you want with corrected selection
alert(sel.toString());
// release
sel.detach();

在此代码中，如果在您的特定div中选择了文本，则将保留该文本，如果在其他元素也参与选择的情况下，这些选择范围将被切断.

In this code if text was selected in your specific div then it will be kept, if there was selection where other elements take part too, these selection ranges will be cut off.

相关推荐