当前位置: 代码迷 >> JavaScript >> 关于range对象替换,ie上select()不管用了,FF也没解决方法
  详细解决方案

关于range对象替换,ie上select()不管用了,FF也没解决方法

热度:174   发布时间:2012-08-13 13:21:53.0
关于range对象替换,ie下select()不管用了,FF也没解决办法
range = frame[0].contentWindow.document.selection.createRange();
  //FF是frame[0].contentWindow.getSelection().getRangeAt(0)
IE使用pasteHTML后,没法重新选定,FF也不知道如何重

var html = "<span>aaa</span>";
///------IE代码
range.pasteHTML(html);
range.select();

//-----FF代码
html = range.createContextualFragment(html);
range.deleteContents()
range.insertNode(html);
range.select();

两个游览器下select()都无法重新选定替换后的内容,求高人解决,分还可以加

------解决方案--------------------
我做的一个例子,适合IE,你看看,时间来不及,我得先出去了,具体思路是自己维护一个全局的guid,每一个插入的span都有自己的guid,接着根据guid选择这个元素,然后把范围移动到这。 我的例子简单的用了class判断。
JScript code

<script type='text/javascript'>

window.onload = function(){
  var html = '<span style="background:yellow" class="myspan">bbbbb</span>';
   document.getElementById('l').onclick = function(){
           /*IE*/
           range = document.selection.createRange();
           
           range.pasteHTML(html);
           var pElem = range.parentElement();
               chElems = pElem.getElementsByTagName('span');
               
           for(var i = 0, len = chElems.length; i < len; ++i){
               if(chElems[i].className === 'myspan'){
                   break;
               }
           }
           var brange  = document.body.createTextRange();
           brange.moveToElementText(chElems[i]);  
           brange.select();  
           
   };    
};
</script>

<html>
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<input type='button' id = 'l'  value='insert' />
</html> 
  相关解决方案