[JS] onbekede fout bij execcommand in FF

[Rhapsody]

Hallo,

Bij het maken van een richtexteditor ben ik tegen een onbekende fout opgelopen. Ik heb geen idee waar het aan ligt, ook een zoekactie op GoT en google leverde weinig op. Er zijn wel mensen met hetzelfde probleem, maar op die sites is er niemand met een oplossing.

De fout die ik in Firefox krijg: (in IE werkt het wel gewoon)

code:

Error: uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMNSHTMLDocument.execCommand]"  nsresult: "0x80004005 (NS_ERROR_FAILURE)"  location: "JS frame :: file:///C:/Documents%20and%20Settings/Mathieu/My%20Documents/Richtext/data/rte.js :: anonymous :: line 112"  data: no]

De fout wordt veroorzaakt op deze regel:

JavaScript:

document.getElementById('txtEditor').contentWindow.document.execCommand('underline', false, null); 

Ik heb dus een editor, (een iframe) die ik via Js (via document.writeln) aanroep en opstart. Alles gaat goed, en in IE werkt het ook netjes.
Na een zoekactie besloot ik toch voor execCommand te gaan, aangezien deze ook ondersteund wordt door Mozilla. (http://www.mozilla.org/editor/midas-spec.html)

Heeft er iemand een idee waar dit aan kan liggen?

[Creepy]

Wat is dat toch met Javascript de laatste tijd. Bekijk P&W FAQ - HTML / javascript /css, etc... eens.
Move P&W -> W&G

[Rhapsody]

oh excuses ik dacht dat ik in W&G zat...

[BtM909]

Wat is je target wat je probeert te under-linen, een range ?

[Woudloper]

Heb je wellicht iets meer code? Controleer je bijvoorbeeld ook of een range geselecteerd is o.i.d.? Verder kan je ook ene kijken naar bestaande Rich Text Editors (zoals: FCK Editor) om te zien hoe zij het hebben opgelost...

[Rhapsody]

Het aanroepen van de editor gaat als volgt:

JavaScript:

function rte(name)
{
   this.name = name;        
   this.initialize = function()
   {
      document.writeln('<div id="editor">');
      this.initButtons();
      this.initEditor();
      document.writeln('</div>');
      this.activateEditor();
   }
   this.initButtons = function()
   {
      // hier worden alle knoppen op het scherm gezet...
      // wanneer er op een knop geklikt word wordt de functiebuttonClick(knop) aangeroepen
   }
   this.initEditor = function()
   { 
      document.writeln('<iframe id="txtEditor" nam="txtEditor" style="width: 100%; height: 300px;" frameborder="0"></iframe>');
   }
   this.buttonClick = function(btn) 
   {
      rte.setFocus();
      // ff een text switch gemaakt
      switch (btn)
      {
         case 'underline':
    document.getElementById('txtEditor').contentWindow.document.execCommand('Bold', false, null)
    break;
      }
      rte.setFocus();
   }
   this.buttonPressed = function(btn_id) { document.getElementById(btn_id).className = 'pressed'; }
   this.buttonRaised = function(btn_id) { document.getElementById(btn_id).className = 'normal'; }
   // retrieve editor frame
   this.RTiFrameWindow = function() { return document.getElementById('txtEditor').contentWindow; }
   // activate frame
   this.activateEditor = function() { rte.RTiFrameWindow().document.designMode = 'On' }
   // set focus
   this.setFocus = function() { rte.RTiFrameWindow().focus(); }
   this.getCode = function() { return rte.RTiFrameWindow().document.body.innerHTML; }

Nu doe ik elke keer rte.RTiFrameWindow() ipv this.RTiFrameWindow(), volgens mij gaat het daar fout. Maar this.RTiFrameWindow() werkt niet...

[ Voor 38% gewijzigd door Rhapsody op 24-01-2005 12:36 . Reden: ff wat duidelijker gemaakt ]

[Rhapsody]

als ik de volgende code gewoon in een bestand zet:

code:

<iframe id="iView" nam="iView" style="width: 100%; height: 300px;" frameborder="2"></iframe>
<input type="button" value="code" onclick="
document.getElementById('iView').contentWindow.document.designMode = 'on';
document.getElementById('iView').contentWindow.document.execCommand('bold', false, null);"/>

Dan werkt het wel in mozilla..... Het ligt dus duidelijk aan de manier waarop ik het aanroep, in dit geval rte.RTiFrameWindow(). etc etc

[ Voor 17% gewijzigd door Rhapsody op 24-01-2005 13:17 ]

[MarkvE]

Rhapsody schreef op maandag 24 januari 2005 @ 13:17:Het ligt dus duidelijk aan de manier waarop ik het aanroep, in dit geval rte.RTiFrameWindow(). etc etc

Deze problemen met soortgelijke foutmeldingen heb ik ook gehad, het lag telkens aan de manier waarop je het object met de designMode benaderd, zo kreeg ik het niet voor elkaar om een dynamisch geplaatst iframe als "editor" te gebruiken. Deze moest al statisch in het document staan, anders kreeg ik telkens een vage error die lijkt op de error die je in je OP hebt gezet.

[Verwijderd]

MarkvE schreef op maandag 24 januari 2005 @ 13:39:
[...]


Deze problemen met soortgelijke foutmeldingen heb ik ook gehad, het lag telkens aan de manier waarop je het object met de designMode benaderd, zo kreeg ik het niet voor elkaar om een dynamisch geplaatst iframe als "editor" te gebruiken. Deze moest al statisch in het document staan, anders kreeg ik telkens een vage error die lijkt op de error die je in je OP hebt gezet.

Dat probleem kan je oplossen door een lege string naar het document van het frame te schrijven met write method. Raar, maar waar

[Rhapsody]

Verwijderd schreef op maandag 24 januari 2005 @ 13:42:
[...]


Dat probleem kan je oplossen door een lege string naar het document van het frame te schrijven met write method. Raar, maar waar

Ik heb geprobeerd om een lege string te schrijven, maar ook dat maakt niets uit

[Verwijderd]

Onderstaande testcase heeft geen enkel probleem.

MarkvE > De oplossing zit hem in de lege write method. Dit voorkomt dat Gecko een foutmelding geeft. Raar maar waar. Zet voor de grap maar eens wat commentaar om de lege write method.

Rhapsody. In mijn voorbeeld heb ik geen enkel probleem met het gebruik van het this keyword.

_{Java slechts gekozen voor de Syntaxhighlighting}

Java:

<html>
  <head>
    <title>Testcase</title>
    <script>

    function addEvent(el, evname, func) {
      try {
        if (el.attachEvent) {
          el.attachEvent("on" + evname, func);
        } else if (el.addEventListener) {
          el.addEventListener(evname, func, false);
        }
      } catch (e) {}
    }

    function rte(name) {

      var frame = document.createElement("IFRAME");
      frame.style.width = frame.style.height = "400px";
      frame.id = "editor_" + name;
      document.body.appendChild(frame);
      this.editor = document.getElementById("editor_" + name).contentWindow;
      this.document = this.editor.document;
      this.document.designMode = "On";
      
      ///*
      this.document.open();
      this.document.write("");
      this.document.close();
      //*/
      addEvent(this.document, "keyup", function (e) {
        alert("Woei");
      });
    }

    rte.prototype = {
      getFrame:function() {
        return this.editor;
      }
    };



    window.onload = function () {

      var editor = new rte("naam");
      editor.getFrame();

    }

    </script>
  </head>
  <body>
  </body>
</html>

[ Voor 30% gewijzigd door Verwijderd op 24-01-2005 15:30 ]

[Rhapsody]

Intusse heb ik alles omgezet naar gewoon html en dat werkt wel, dus ik ga eens kijken naar jouw testcase. Hartelijk bedankt in ieder geval.