DesignMode und Tastenabfrage im iFrame-body-Element

[Struppi]

Wer weiß Rat?

Ich hab jetzt mal ein bisschen rumprobiert und geschaut wie es htmlarea macht. Dort wird zwar an sich ein anderer Weg gegangen, dort wird der HTML Code mit document.write() geschrieben, hat aber mir den richtigen Weg gezeigt.

Du musst die Funktion copyCode so anpassen:

  
        copyCode : function (toggleMode) {  
            var codeSource = document.getElementById(HighLighter.settings.formElement);  
            var iFrame = document.getElementById(HighLighter.settings.prefix + "codePreview");  
            var content, HTML;  
  
            if (toggleMode) {  
                // copy code from textarea to iframe  
                code = codeSource.value;  
                // highlight code  
                code = HighLighter.functions.highlight(code);  
                iFrame.contentWindow.document.body.innerHTML = code;  
  
                window.setTimeout(  
                function() {  
                var doc = iFrame.contentWindow.document;  
                if(doc.addEventListener)  
                {  
                doc.addEventListener('keydown', HighLighter.functions.update, true);  
                }  
                else if(doc.attachEvent)  
                {  
                doc.attachEvent("onkeydown" , HighLighter.functions.update);  
                }  
                }  
                , 50  
                );  
  
            } else {  
                // copy code from iframe to textarea  
                codeSource.value = HighLighter.functions.unlight(iFrame.contentWindow.document.body.innerHTML);  
            }  
  
            return;  
        },  

HTMLarea verwendet dafür noch eine Funtion um auch andere Event zu registrieren.

  
// event handling  
  
HTMLArea._addEvent = function(el, evname, func) {  
  if (HTMLArea.is_ie) {  
    el.attachEvent("on" + evname, func);  
  } else {  
    el.addEventListener(evname, func, true);  
  }  
};  
  
HTMLArea._addEvents = function(el, evs, func) {  
  for (var i = evs.length; --i >= 0;) {  
    HTMLArea._addEvent(el, evs[i], func);  
  }  
};  

Damit können mehrere Events abgefangen werden. Ich würd mir HTMLArea mal anschauen, da es von denen WYSIWYG Editoren die ich bisher analysiert habe den übersichtlichsten Code hat.

Struppi.