2010-07-14 4 views
3

Je construis un éditeur WYSWIG très simple pour un div avec contenteditable = "true". J'utilise execCommand pour effectuer un formatage simple, tel que gras, italique et souligné, avec justification du texte.problèmes avec la justification execCommand dans Firefox?

PROBLÈME: gras, italique, souligné tout le travail, mais en utilisant justifyCenter (ou tout justifier) ​​ne fonctionne pas dans Firefox, mais fonctionne dans Chrome et Safari. Chrome et Safari ne semblent pas apprécier ma justification, mais fonctionne parfaitement avec justifyLeft et justifyCenter. Dans Firefox, je reçois le texte suivant:

exception uncaught: [Exception ... "Component a renvoyé le code d'échec: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMNSHTMLDocument.execCommand]" nsresult: "0x80004005 (NS_ERROR_FAILURE)"

Je n'arrive pas à comprendre ce qui ne va pas mais je me demande si cela pourrait avoir quelque chose à voir avec le designMode qui doit être activé dans Firefox? Cependant, gras, italique et souligné fonctionnent très bien sans que j'active explicitement designMode.

Des idées? Merci d'avance.

Répondre

1

Je sais que c'est une sorte de réponse tardive, et vous l'avez probablement déjà compris, mais pour ceux qui ne l'ont pas encore fait, essayez de mettre contenteditable à true pour le corps. J'essaie de trouver un moyen de contourner ce problème parce que chaque navigateur justifie le texte sans le vouloir, et je ne veux pas que toute la page soit éditable.

1

Le bug est référencé ici: https://bugzilla.mozilla.org/show_bug.cgi?id=442186 Quelqu'un a proposé cette solution de contournement:

try 
{ 
    document.execCommand('justifyright', false, null); 
} 
catch (e) 
{ 
    //special case for Mozilla Bug #442186 
    if(e && e.result == 2147500037) 
    { 
     //probably firefox bug 442186 - workaround 
     var range = window.getSelection().getRangeAt(0); 
     var dummy = document.createElement('br'); 

     //find node with contentEditable 
     var ceNode = range.startContainer.parentNode; 
     while(ceNode && ceNode.contentEditable != 'true') 
      ceNode = ceNode.parentNode; 

     if(!ceNode) 
      throw 'Selected node is not editable!'; 

     ceNode.insertBefore(dummy, ceNode.childNodes[0]); 
     document.execCommand('justifyright', false, null); 
     dummy.parentNode.removeChild(dummy); 
    } 
    else if(console && console.log) 
     console.log(e); 
} 

Il consiste à créer un élément factice (un <br />) et le retirer après l'exécution de la commande * justifier.

Questions connexes