✔ WYSIWYG Editor macht im IE Probleme

one6666

one6666

Mitglied Titanium
Hallo,

mein WYSIWYG Editor funktioniert im Firefox und Opera schon mal zu 100% so wie ich das möchte,
auch im Internet Exploer geht er so halb :confused:

Zusatz:
Mir ist gerade eine Idee eingefallen, wenn es irgentwie geht das man einfach behauptet das ein leerzeichen gerade makiert ist,
könnte man den Bug umgehen,
wenn es keine richtige Lösung gibt, wäre mir schon gehollfen zuwissen wie ich das Script im glauben lasse das beim klicken auf ein Button schon ein Leerzeichen makiert ist ?

Hier der Code:
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Textfeld</title>

      <script type="text/javascript">
            
			function start(){
			
	              document.getElementById("textfeld").contentDocument.designMode = "on";
				  
			}
			
			function aussehen(befehl, fehler, eigenschafft){
			
			      document.getElementById('textfeld').contentDocument.execCommand(befehl, fehler, eigenschafft);
			
			      parent.textfeld.focus();

			}
	
			function senden(){
			      
				  var text = document.getElementById('textfeld').contentWindow.document.body.innerHTML;
				  
				  var umwandeln_1 = text.replace(/<P>/g, "");
				  
				  var umwandeln_2 = umwandeln_1.replace(/<\/P>/g, "<br>");
				  
				  document.getElementById("ausgabe").innerHTML = umwandeln_2;
			
  			}
	  
      </script>
      
      <style type="text/css">
	    
            .rahmen{
			border:#CCCCCC 1px solid;
			width:400px;
			height:100px;
			}
			
			.box{
			width:400px;
			margin:300px auto;
			}
		    
			.bilder{
			border:#999999 1px solid;
			}
			
	  </style>
      
</head>

<body onload="start()">
      <div class="box">
      <table>
            <tr>
                  <td>
                        <b>So Sieht es Später aus!</b>
                        <div class="rahmen" id="ausgabe"></div>
                  </td>
            </tr>
            <tr>
                  <td>
                  
                        <!-- Text Eigenschafften -->
                  
                        <button onclick="aussehen('Bold', false, null)">B</button>
                        <button onclick="aussehen('Italic', false, null)">I</button>
                        <button onclick="aussehen('Underline', false, null)">U</button>
                        
                        <!-- IMG Eigenschafften -->
                        
                        <img onclick="aussehen('insertimage', false, 'bilder/icon41.gif')" src="bilder/icon41.gif" />
                        <img onclick="aussehen('insertimage', false, 'bilder/laugh.gif')" src="bilder/laugh.gif" />
                        <img onclick="aussehen('insertimage', false, 'bilder/looney.sml.gif')" src="bilder/looney.sml.gif" />
                  </td>
            </tr>
            <tr>
                  <td>
                        <div class="rahmen">
                              <iframe id="textfeld" name="textfeld" src="editor.html" marginheight="0" marginwidth="0" width="400" height="100" frameborder="0"></iframe>
                        </div>
                  </td>
            </tr>
            <tr>
                  <td align="right">
                        <button onclick="senden()">Senden</button>
                  </td>
            </tr>
      </table>
      </div>
</body>
</html>
Im Firefox und im Opera kann man einfach den Button B drücken und der nachfolgende Text wird dick geschrieben,
im Internet Exploer muss man aber alles erst makieren damit sich was ändert :confused:

Weiß jemand wodran dies liegen könnte ?
 
Zuletzt bearbeitet:
Moin,

erstmal generell:
Ich nehme an, du probierst das ganze im IE8(woanders habe ich dieses Problem nicht festgestellt)...

So, wie du es hast(den Zugriff auf das Dokument), ist es zwar Korrekt nach w3c-Richtlinien, jedoch nicht kompatibel zu IE<8
Code: 
document.getElementById("textfeld").contentDocument


Greife daher optional(z.b. über ein try/catch-Statement) auf das Dokument im Editor so zu:
Code: 
document.getElementById("textfeld").contentWindow.document
(also so, wie du es in senden() bereits tust )

Zu dem eigentlichen Problem:
Bei mir brachte folgendes Erfolg....

Du hast ja am Ende der Funktion aussehen() folgendes stehen:
Code: 
parent.textfeld.focus();

Verfrachte diese Anweisung vom Ende an den Anfang der Funktion....das sollte es schon gewesen sein :)
 
omg du bist der Jesus unter den Javascript Codern :)
Ich war schon am verzweifeln, habe schon kurz drüber nachgedacht wie alle anderen eine fertige Lösung zunehmen :( (hätte ich aber nicht gemacht :D)
Ein ganz größes Dankeschön an dich :)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück