在Internet Explorer的隱藏元素上添加選擇引發錯誤

我想在我的網頁上選擇一定範圍。如果元素被隱藏，則IE（Internet Explorer）和Edge會報錯。我如何將選擇添加到隱藏元素上的文檔？在Internet Explorer的隱藏元素上添加選擇引發錯誤

例

<html> 
    <head> 
    <meta name="robots" content="noindex"> 
    <script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
    <meta charset="utf-8"> 
    <title>JS Bin</title> 
    <style id="jsbin-css"> 
     #d2{ 
     display:none; 
     } 
    </style> 
    </head> 
    <body> 
    <div id="d1">div1</div> 
    <div id="d2">div2</div> 
    <div id="d3">div3</div> 
    <a onclick="doSel()" href="javascript:void(0)">click me:)</a> 
    <script id="jsbin-javascript"> 

    function doSel(){ 
    var element = $("#d2").contents()[0]; 
     var myRange = createRange(element,1, element,2); 

     console.log(myRange); 
     document.getSelection().removeAllRanges(); 
     document.getSelection().addRange(myRange); 
    } 

    function createRange(startContainer, startOffset, endContainer, endOffset){ 
     var rangeObj  = document.createRange(); 

     rangeObj.setStart (startContainer, startOffset); 
     rangeObj.setEnd (endContainer, endOffset); 

     return rangeObj; 
    } 
    </script> 

    </body> 
</html>

在此頁面中我選擇在Firefox和Chrome中的div 「我」＃D2，但IE瀏覽器給我的錯誤unspecified error和邊緣給我Could not complete the operation due to error 800a025e.。這些錯誤引發在這條線上：document.getSelection().addRange(myRange);

如何解決問題並在IE和Edge中爲我的文檔選擇添加範圍？

來源

2015-10-16 Gert Kommer

如果你已經做了[本搜索（https://www.google.com/search?q=錯誤％20800a025e％20selection）請告訴我們。如果不是，爲什麼不呢？ – mplungjan

@mplungjan我點擊搜索，但沒有找到任何有用的答案。使用'removeAllRanges（）'的答案在我的情況下不起作用。這就是爲什麼我問:) –

我做了這個搜索，找不到任何關於錯誤原因的解釋。

解決方法，並且如果元素具有display: none（但Edge就是），Chrome/FF將不會返回任何值，而是首先實際檢查該元素。如果它有display:none，則返回空字符串。

我也試過下面的演示，如果要抓取的元素有display:none，抓住前一個和下一個元素。

有了這個，我實際上能夠抓住display:none元素的文本，儘管它只適用於IE11。

測試：代碼http://jsfiddle.net/p0k7jj12/2/

部分爲快速測試我做

function doSel(){ 

    var element3 = $("#d3").contents()[0]; 
    var element2 = $("#d2").contents()[0]; 
    var element1 = $("#d1").contents()[0]; 

    var myRange = createRange(element1,4, element3,0); 

    console.log(myRange); 
    document.getSelection().removeAllRanges(); 
    document.getSelection().addRange(myRange); 

    alert(document.getSelection()); 

}

來源

2015-10-16 08:41:10 LGSon

謝謝你的回答：D，我看着你的小提琴，我必須承認它是有創意的，但它選擇了第二個div的全部內容，而不是一個字符，如我的示例中所示。我確實以另一種方式解決了我的問題。我想包裝選擇，我也可以這樣做： var a = $（「」，{id：anchorId，「class」：「noteElement」}）; rangeObj.surroundContents（a [0]）;' 首先，我將所有選擇包裝在文檔中。現在我一次包裝一個元素。 –

這是一個很好的，發佈它作爲一個自我答案。 – LGSon

我提供的解決方案是在不添加文檔的情況下打包範圍。這不是問題的答案。問題是：如何將範圍元素添加到容器隱藏的文檔中。所以我不確定將它作爲正確答案發布。 –

在Internet Explorer的隱藏元素上添加選擇引發錯誤

回答

相關問題