web-dev-qa-db-fra.com

CreateTextRange ne fonctionne pas dans Chrome

Dans ce code, createRange ne fonctionne pas dans Chrome. Dans IE cela fonctionne. Aidez-nous à rectifier cela. Y a-t-il une autre propriété pour fonctionner comme create range. Pour que cela soit utile pour mon projet.

<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
      }
    }
javascriptgoogle-chromecompatibility
15
Bhargavi

CreateTextRange est un fonction spécifique à Microsoft , mais il existe un moyen simple de contourner ce problème.

Utilisez createRange à la place comme dans ce message par exemple:

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);
}
13
GôTô

createTextRange est uniquement dans IE.

Jetez un oeil à celui-ci http://help.dottoro.com/ljrvjsfe.php

3
Sho

J'ai eu ce problème avec le JSDOM du nœud et le codemirror (qui tente d'utiliser document.createRange)

Cela se produit parce que document.createRange (chrome) n'existe pas ATM sur JSDOM et il essaie donc d'utiliser à la place document.body.createTextRange (IE) et tombe.

Pour résoudre ce problème, j'ai dû stub la fonction document.createRange dans ma configuration de test unitaire comme suit:

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

On parle de polyfilling JSDOM document.createRange:

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

Au moment d'écrire ces lignes, cela ne s'était pas encore produit.

3
danday74

En date du 31 mars 2020. Cela fonctionne pour se moquer de JSDOM pour les tests unitaires de plaisanterie

(window as any).global.document.createRange = () => {
    return {
        setEnd: () => {},
        setStart: () => {},
        getBoundingClientRect: () => {},
        getClientRects: () => []
    };
};
0
David Dehghan