2014-02-05 221 views
8

在此代碼中,createRange在Chrome中不起作用。在IE中它正在工作。請幫助如何糾正這一點。是否有任何其他財產像創造範圍一樣工作?這樣對我的項目會有幫助。CreateTextRange在Chrome中不起作用

<script language=javascript> 

    var isSelected; 
    function markSelection (txtObj) { 
     if (txtObj.createTextRange) { 
     txtObj.caretPos = document.selection.createRange().duplicate(); 
     isSelected = true; 
     } 
    } 

    function insertTag (txtName, enclose) { 
     if(document.f_activity_email == null) { 
      var tag = document.getElementById('EmailTokenID').value; 
     } 
     else { 
      var formC = document.f_activity_email; 
      var tag = formC.EmailTokenID.value; 
     } 
     var closeTag = tag; 
     if (enclose) { 
      var attribSplit = tag.indexOf (' '); 
      if (tag.indexOf (' ') > -1) 
       closeTag = tag.substring (0, attribSplit); 
     } 
     if (isSelected) { 
      var txtObj = eval ("document.forms[0]." + txtName); 
       if (txtObj.createTextRange && txtObj.caretPos) { 
        var caretPos = txtObj.caretPos; 
        caretPos.text = ((enclose) ? "<"+tag+">"+caretPos.text+"</"+closeTag+">" : tag+caretPos.text); 
        markSelection (txtObj); 
        if (txtObj.caretPos.text=='') { 
        isSelected=false; 
        txtObj.focus(); 
       } 
      } 
     } else { 
     // placeholder for loss of focus handler 
     } 
    } 

回答

7

的createTextRange是Microsoft specific function,但有一個簡單的解決辦法。

使用createRange,而不是作爲this post例如:

if (document.selection) { //IE 
    var range = document.body.createTextRange(); 
    range.moveToElementText(document.getElementById(containerid)); 
    range.select(); 
} else if (window.getSelection) { //others 
    var range = document.createRange(); 
    range.selectNode(document.getElementById(containerid)); 
    window.getSelection().addRange(range); 
} 
2

我曾與節點的JSDOM和codemirror(它試圖使用document.createRange)

它發生這個問題,因爲document.createRange(鉻)在JSDOM上並不存在ATM,所以它試圖使用document.body.createTextRange(IE)來代替,並且摔倒了。

爲了解決這個問題,我不得不存根document.createRange功能在我的單元測試設置如下:

global.document.createRange =() => { 
    return { 
    setEnd:() => {}, 
    setStart:() => {}, 
    getBoundingClientRect:() => {} 
    } 
} 

有講JSDOM polyfilling document.createRange:

https://github.com/tmpvar/jsdom/issues/399

在撰寫本文時尚未發生。