Guten Tag!
Vor kurzem habe ich einen Online-WYSIWYG-Editor programmiert. Etwas ganz einfaches, aber es funktioniert.
Nun habe ich eine Frage: Ich würde gerne eine kleine Erweiterung machen, welche folgendes kann:
Man klickt auf den Knopf "coden" und dann erscheint der HTML-Code des ganzen. Wie kann ich sowas da einbauen?
HTML
<html>
<head>
<title>Online-Editor/title>
</head>
<script>
function format(command, parameter)
{
divEditable.focus();
document.execCommand(command, false, parameter);
}
</script>
<body>
<button onClick="format('JustifyLeft', '');" style="border: 1px solid #aaaaaa;">Text beginnen
</button>
<button onClick="format('Bold', '');" style="border: 1px solid #aaaaaa;" >[b]B[/b]</button>
<button onClick="format('Italic', '');" style="border: 1px solid #aaaaaa;">[i]K[/i]</button>
<button onClick="format('Underline', '');" style="border: 1px solid #aaaaaa;"><u>U</u></button>
<button onClick="format('FontName', 'Times New Roman');" style="border: 1px solid #aaaaaa;"><font face="Times New Roman">Times</font></button>
<button onClick="format('FontName', 'Arial');" style="border: 1px solid #aaaaaa;"><font face="Arial">Arial</font></button>
<button onClick="format('FontName', 'Courier New');" style="border: 1px solid #aaaaaa;"><font face="Courier New">Courier New</font></button>
<button onClick="format('ForeColor', 'black');" style="border: 1px solid #aaaaaa;"><font color="black">schwarz</font></button>
<button onClick="format('ForeColor', 'red');" style="border: 1px solid #aaaaaa;"><font color="red">rot</font></button>
<button onClick="format('ForeColor', 'blue');" style="border: 1px solid #aaaaaa;"><font color="blue">blau</font></button>
<button onClick="format('FontSize', 1);" style="border: 1px solid #aaaaaa;">1</button>
<button onClick="format('FontSize', 3);" style="border: 1px solid #aaaaaa;">2</button>
<button onClick="format('FontSize', 5);" style="border: 1px solid #aaaaaa;">5</button>
<button onClick="format('FontSize', 7);" style="border: 1px solid #aaaaaa;">7</button>
<div style="height:300; width=95%; background-color:white; padding:3; border:inset 2px; overflow:auto;" id="divEditable" contenteditable></div>
</body>
</html>
[/code]
