sonic: designMode und white-space: pre in Firefox

SELF-Forum

designMode und white-space: pre in Firefox

sonic
– Informationen zu den Bewertungsregeln

Hi!

Ich versuche gerade, einen Quellcode-Editor auf designMode bzw. contentEditable umzubauen und stosse dabei in Firefox auf das Problem, das beim Laden bereits vorhandene Newlines im Editor-Content ignoriert werden. Vereinfacht gesagt ist das Vorgehen folgendes:

  
var editor_content = load_code_from_somewhere();  
  
var iframe = document.createElement('iframe');  
iframe.contentDocument.designMode = 'on';  
  
//erzeuge html, head, title, body usw. für iframe und append()e das Ganze  
  
var iframe_body = iframe.getElementsByTagName('body')[0];  
  
iframe_body.innerHTML = '<span>' + editor_content.replace(/</g, '&lt;') + '</span>';  
  
iframe_body.style.whiteSpace = 'pre';

In Opera funktioniert das Ganze einwandfrei, aber Firefox ignoriert die Newlines, d.h. der komplette Editor-Inhalt steht in einer Zeile. Wenn ich die Zeile mit dem designMode auskommentiere, stellt FF die newlines korrekt dar (aber dann kann ich natürlich nicht mehr editieren).

Wenn ich stattdessen die Zeile mit dem whiteSpace auskommentiere und das Attribut nachträglich in Firebug von Hand einstelle, ist die Darstellung ebenfalls korrekt.

Falls jemand ne Idee hätte, wie ich FF davon überzeugen kann, die newlines ohne händische Eingriffe korrekt darzustellen, würde mir das echt weiterhelfen.

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. designMode und white-space: pre in Firefox

    ChrisB
    – Informationen zu den Bewertungsregeln

    Hi,

    Wenn ich stattdessen die Zeile mit dem whiteSpace auskommentiere und das Attribut nachträglich in Firebug von Hand einstelle, ist die Darstellung ebenfalls korrekt.

    Und wenn du die Angabe machst, bevor du Inhalt einfügst?

    MfG ChrisB

    --
    “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. designMode und white-space: pre in Firefox

      sonic
      – Informationen zu den Bewertungsregeln

      Und wenn du die Angabe machst, bevor du Inhalt einfügst?

      Hab ich probiert, macht aber leider keinen Unterschied.

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. designMode und white-space: pre in Firefox

        ChrisB
        – Informationen zu den Bewertungsregeln

        Hi,

        Und wenn du die Angabe machst, bevor du Inhalt einfügst?

        Hab ich probiert, macht aber leider keinen Unterschied.

        Hast du mal ein Online-Beispiel, an dem man das ganze nachvollziehen kann?

        MfG ChrisB

        --
        “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. designMode und white-space: pre in Firefox

          sonic
          – Informationen zu den Bewertungsregeln

          Hast du mal ein Online-Beispiel, an dem man das ganze nachvollziehen kann?

          Hm. Ich hab jetzt mal ein simples Beispiel gebaut, das im Prinzip dieselbe Funktionalität hat, mit dem tritt aber interessanterweise der Fehler nicht auf. D.h. vermutlich ist das irgendeine Interaktion mit anderen Code-Elementen. Werde also nochmal debuggen müssen. Das (funktionierende) Beispiel sieht dann so aus:

            
<html>  
<head></head>  
<body>  
  
<textarea id="test2">  
Zeile 1  
Zeile 2  
</textarea>  
  
<script type="text/javascript">  
var iframe = document.createElement('iframe');  
  
document.body.appendChild(iframe);  
  
iframe.contentWindow.document.open();  
iframe.contentWindow.document.write('<html><head><title></title></head><body></body></html>');  
iframe.contentWindow.document.close();  
iframe.contentDocument.designMode='On'  
  
var iframe_body =  
iframe.contentWindow.document.getElementsByTagName('body')[0];  
  
iframe_body.style.fontFamily = 'monospace';  
iframe_body.style.whiteSpace = 'pre';  
iframe_body.innerHTML = document.getElementById('test2').value;  
  
</script>  
  
</body>  
</html>
          Beitrag melden
          –
          Informationen zu den Bewertungsregeln