Rouven: WYSIWYG/ selection.createRange()

Beitrag lesen

Hi Thomas,

also folgendes habe ich gerade ausprobiert:

<html>
<head>
<script>
 function Init() {iView.document.designMode = 'On';}

function CreateTable(){
          var zeile = prompt("Bitte geben Sie die Zeilenanzahl der Tabelle an","1");
          var spalte = prompt("Bitte geben Sie die Spaltenanzahl der Tabelle an","1");
          var text='<table border="1">';
          for (i=0;i<zeile;i++){
               text+='<tr>';
               for (j=0;j<spalte;j++){
                 if ((i==0) && (j==0)) {
                  text += '<td>'+iView.document.selection.createRange().text+'</td>';
                 } else {
                     text += '<td></td>';
                    }
               }
               text+='</tr>';
          }
          text+='</table>';
          iView.document.selection.createRange().pasteHTML(text);
 }

function showsource() {
 iView.document.body.innerText = iView.document.body.innerHTML;
}

function showhtml() {
 iView.document.body.innerHTML = iView.document.body.innerText;
}
</script>
</head><body onLoad="Init();">

<img class="butclass" src="http://localhost/createtable.gif" alt="Tabelle" title="Tabelle einfügen" onClick="iView.focus(); CreateTable();"/>
<a href="#" onclick="showsource();">|| Source anzeigen</a>
<a href="#" onclick="showhtml();">|| Text anzeigen</a>
<iframe id="iView"  style="width:100%; height:450px;"></iframe>
</body></html>

Ich hab zwei Links in die Funktionsleiste gepackt, zum Testen, schalt mal auf Source anzeigen, tipp dann mal etwas wie
<i>kursiv</i> nicht kursiv
Dann machst du Text anzeigen --> er zeigt den ersten Teil kursiv. Nun markierst du den hinteren Teil und machst die Tabellen-Funktion. Er wird nun genau diesen Teil in die erste Zelle der Tabelle packen (siehe if-Bedingung in der text-Schleife).
Der Witz an dem Table ist, dass dein Weg zu umständlich war, mach einfach statt der Hin-Und-Herwandlerei ein .pasteHTML auf der Selection.

MfG
Rouven

--

-------------------
ss:) zu:) ls:& fo:) de:< va:{ ch:? sh:) n4:( rl:? br:$ js:| ie:) fl:(