Axel Richter: Richtext Editor (Abfrage der Formatierung)

Beitrag lesen

Hallo,

Also wie gesagt mittels
var formatstring = document.frame.queryCommandValue(...) scheint es zu funktionieren..

Naja, frame.queryCommandValue gibt es nicht. Das ist eine Methode des document. Für einiges brauchst Du auch noch queryCommandState.

aber wie am besten abfragen?

Schreib einen eigenen Thread, der die queryCommandValue und queryCommandState des Documents überwacht. In JavaScript nicht so ohne, weil nur als immer wieder startende Funktion implementierbar.

Beispiel:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
        "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<title>IFrame im Designmode f&uuml;r IE und Mozilla</title>  
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
<script type="text/javascript">  
<!--  
function watchFormats() {  
 var editorDoc = document.getElementById('editor').contentWindow.document;  
 var format = "";  
 format += editorDoc.queryCommandValue('fontname') + " ";  
 format += editorDoc.queryCommandValue('fontsize') + " ";  
 if (editorDoc.queryCommandState('bold')) format += "bold ";  
 if (editorDoc.queryCommandState('italic')) format += "italic ";  
 if (editorDoc.queryCommandState('underline')) format += "underline ";  
 document.getElementById('tf').value = format;  
}  
  
window.onload = function() {  
  var editorDoc = document.getElementById('editor').contentWindow.document;  
  editorDoc.designMode="on";  
  
  editorDoc.execCommand('fontname', false, 'Times New Roman');  
  editorDoc.execCommand('fontsize', false, '12');  
  window.setInterval("watchFormats()", 100);  
};  
//-->  
</script>  
</head>  
  
<body>  
  
<h1>Demonstration der Nutzung eines IFrames als Editor-Element</h1>  
  
<p><button onclick="document.getElementById('editor').contentWindow.document.execCommand('bold', false, null)">Fett</button>  
<button onclick="document.getElementById('editor').contentWindow.document.execCommand('italic', false, null)">Kursiv</button>  
<button onclick="document.getElementById('editor').contentWindow.document.execCommand('underline', false, null)">Unterstrichen</button></p>  
  
<p><label>aktuelles Format </label><input type="text" id="tf" value="" size="50" maxlength="50"></p>  
  
<p>Hier Text eingeben:</p>  
  
<iframe id="editor" width="400" height="100"></iframe>  
  
<p><textarea rows="5" cols="50" id="ta"></textarea></p>  
  
<button onclick="document.getElementById('ta').value=document.getElementById('editor').contentWindow.document.getElementsByTagName('html')[0].innerHTML;">Zeige Quelltext</button>  
</body>  
</html>  

viele Grüße

Axel