Javascript getSelection（）在IE中不工作

有人能帮我让这个代码在IE中工作吗

HTML:

<p>Alex Thomas</p>
<button id="click">Click</button>

编码在这里：

提前感谢…

如果您想将“Alex Thomas”涂成红色，您可以这样做

HTML

<p id='txt'>Alex Thomas</p>
<input type='button' id='btn' value='click' />

---

9之前的IE不支持

window.getSelection（）

。您可以使用

document.selection

（有关说明，请参阅）。此选择对象有一个方法

createRange（）

，该方法返回一个

TextRange

对象（有关详细信息，请参阅）

请注意，

选择

和

文本范围

对象都是微软自己的实现，不遵循W3C标准。您可以在上阅读有关

textrange

和

range

问题的更多信息

IE中的以下实现工作：

$('#click').click(function(){
    var range = document.selection.createRange();
    range.pasteHTML("<span style='color: red'>" + range.htmlText + "</span>");
});

$（'click'）。单击（函数（）{
var range=document.selection.createRange（）；
range.pasteHTML（“+range.htmlText+”）；
});

它不如其他实现好，因为您必须使用字符串而不是dom。有一个小技巧，您可以将

粘贴为占位符，然后使用dom替换它。您仍然需要使用

range.htmlText

或

range.text

顺便说一句：上述实现显然只是IE而已。您必须使用一些浏览器功能检测来决定使用哪个版本。

在此处测试此版本：

这有点像黑客，不太好看，但应该可以在IE和其他浏览器中使用——不过我还没有做过很多跨浏览器测试：）

$（'click'）。单击（函数（）{
var whatBrowser=getIt（）；
如果（whatIsIt=='notIE'&&whatBrowser）{
诺蒂（whatBrowser）；
}
else if（whatIsIt==“isIE”&&whatBrowser）{
伊西（whatBrowser）；
};
});
var whatIsIt=“”；
函数getIt（）{
if（window.getSelection）{
whatIsIt=“notIE”；
返回window.getSelection（）；
}
else if（document.getSelection）{
whatIsIt=“notIE”；
return document.getSelection（）；
}
否则{
var selection=document.selection&&document.selection.createRange（）；
if（selection.text）{
whatIsIt=“isIE”；
返回选择；
};
返回false；
};
返回false；
};
功能isIE（选择）{
如果（选择）{
var selectionContents=selection.text；
如果（选择内容）{
selection.pasteHTML（“”+selectionContents+“”）；
};
};
};
功能说明（选择）{
var range=window.getSelection（）.getRangeAt（0）；
var selectionContents=range.extractContents（）；
var span=document.createElement（“span”）；
span.className=“reddy”；
span.appendChild（selectionContents）；
range.insertNode（span）；
};

@Alex IE 9之前版本未实现

getSelection（）

。该代码在Chrome 8中适用。我选择了文本并点击了按钮，文本变成了红色，所以有些东西可以工作。@Alex你的演示在所有当前浏览器（IE9、FF4、Chrome 10、Safari 5和Opera 11）中都可以工作。+1这是一个很棒的getSelection演示。+1非常好的问题和演示他想让“Alex Thomas”突出显示的部分变成红色，而不是全部。有了这些JS，我想知道你为什么不直接做一个

document.getElementById（“click”）.onclick

作为第一行。但是，对于使用feature detection.OP的完整答案，+1有jQuery，因此我没有更改该部分。您确定IE9不支持

window.getSelection（）

？说是的。@Rijk你是对的，这就是为什么我在IE11

文档中写了“9之前的IE不支持window.getSelection（）。”：）的原因。selection

返回

未定义的
——我不太确定上面的答案是否有效。
$('#click').click(function(){
  $('#txt').attr('color','Red');
});

$('#click').click(function(){
    var range = document.selection.createRange();
    range.pasteHTML("<span style='color: red'>" + range.htmlText + "</span>");
});

$('#click').click(function() {
    var whatBrowser = getIt();
    if (whatIsIt == 'notIE' && whatBrowser) {
        notIE(whatBrowser);
    }
    else if (whatIsIt == "isIE"&& whatBrowser) {
        isIE(whatBrowser);
    };
});

var whatIsIt = "";

function getIt() {
    if (window.getSelection) {
        whatIsIt = "notIE";
        return window.getSelection();
    }
    else if (document.getSelection) {
        whatIsIt = "notIE";
        return document.getSelection();
    }
    else {
        var selection = document.selection && document.selection.createRange();
        if (selection.text) {
            whatIsIt = "isIE";
            return selection;
        };
        return false;
    };
    return false;
};

function isIE(selection) {
    if (selection) {
        var selectionContents = selection.text;
        if (selectionContents) {
            selection.pasteHTML('<span class="reddy">' + selectionContents + '</span>');
        };
    };
};

function notIE(selection) {
    var range = window.getSelection().getRangeAt(0);
    var selectionContents = range.extractContents();
    var span = document.createElement("span");
    span.className= "reddy";
    span.appendChild(selectionContents);
    range.insertNode(span);
};