getSelection（）在IE

Question

不工作

有人可以幫助我得到這個代碼在IE工作，請：

HTML：

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

JS

$('#click').click(function(){ 
    var range = window.getSelection().getRangeAt(0); 
    var selectionContents = range.extractContents(); 
    var span = document.createElement("span"); 
    span.style.color = "red"; 
    span.appendChild(selectionContents); 
    range.insertNode(span); 
}); 

編寫了這裏：http://jsfiddle.net/WdrC2/

在此先感謝...

Answer 1

IE 9之前不支持window.getSelection()。您可以改爲使用document.selection（有關說明，請參見this msdn page）。此選擇對象的方法createRange()返回TextRange對象（有關詳細信息，請參閱this msdn page）。

請注意，selection和textrange對象都是微軟自己的實現，並且不遵循W3C標準。您可以閱讀關於www.quirksmode.org/dom/range_intro.html上的textrange和range問題的更多信息。

下面的實現在IE：

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

這不是幾乎一樣好其他的實現，因爲你有一個字符串，而不是DOM工作。有一點點，你粘貼<span id="myUniqueId"></span>作爲佔位符，然後用dom替換它。儘管如此，您仍需要使用range.htmlText或range.text。

順便說一句：上面的實現顯然是IE只有。您必須使用一些瀏覽器功能檢測來決定使用哪個版本。

Answer 2

如果你想要的顏色 「亞歷克斯·托馬斯」 爲紅色，你可以做

HTML

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

JS

$('#click').click(function(){ 
    $('#txt').attr('color','Red'); 
}); 

Answer 3

測試這一位置：http://jsfiddle.net/6BrWe/

這是一個黑客位的和不那麼漂亮，但應以IE和其他瀏覽器 - 我沒有做過很多跨瀏覽器測試，雖然:)

$('#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); 
}; 

Answer 4

對於一個跨瀏覽器的解決方案看這個問題在計算器上：Is there a cross-browser solution for getSelection()?

這個問題是不是這一個相當重複的，所以我覺得這個問題在這個答案鏈接，而不是它是有用的。我做了這個答案社區維基。