Problème avec document.execCommand dans IE

Question

J'utilise un éditeur html et je voulais étendre la fonctionnalité pour insérer des contrôles html à la position du curseur.

Le code j'utilise est:

document.execCommand("insertHTML", false, "<input type=\"text\">") 

Ce code fonctionne très bien Chrome et FF, mais ont problème dans IE. Cela ne fonctionne tout simplement pas et renvoie une erreur "argument invalide". J'ai essayé le code suivant:

if (document.selection && document.selection.createRange) { 
    range = document.selection.createRange(); 
    range.collapse(false); 
    range.pasteHTML(value); 
} 

mais la zone de texte ajouter en haut du document et non dans l'éditeur html.

J'ai besoin d'aide à ce sujet. Merci d'avance.

Answer 1

Il semble que vous mixiez et que vous associez les normes de navigateur IE et Moderne dans cette méthode. Je ne suis pas sûr que cela fonctionne comme vous le pensez. Essayez un peu console.log() pour firefox ou alert() pour voir quels navigateurs entrent réellement cette méthode :)

Il n'y a pas de document.selection dans Firefox. C'est window.getSelection() à la place:

Essayez de jouer avec ce qui suit. Devrait fonctionner dans les deux navigateurs

if (document.createRange) { // "Standards" :) 
    var selection = window.getSelection(); 

    if (selection.rangeCount > 0) { 
     selRange = selection.getRangeAt(0); 
     var node = document.createTextNode(stringValue); 
     selRange.insertNode(node); 
     selRange.setStartAfter(node); 
     selection.removeAllRanges(); 
     selection.addRange(selRange); 
    } 

} else if (document.selection) { // fallback for IE6-8 
    selRange = document.selection.createRange(); 

    selRange.select(); 
    selRange.pasteHTML(stringValue); 
} 

Si vous encapsulez que dans une méthode et passer « stringValue » vous pouvez insérer du texte partout.

Espérons que ça aide!