DIV per Parametereingabe ändern

O

Ossi

Erfahrenes Mitglied
Irgendwie hat sich ein Fehler eingeschlichen (merkte ich erst heute bei einem Test unter Windows, denn auf dem Mac funktonierte es.
Es soll ein DIV per Parametereingabe (DOM-Mittel, IE-only) geändert werden:

<script language="JavaScript">
function aendern() {
window.document.getElementById("divEditable").style.width = document.daten.breite.value + document.daten.einhbreite.value;
window.document.getElementById("divEditable").style.height = document.daten.hoehe.value + document.daten.einhhoehe.value;
window.document.getElementById("divEditable").style.border = document.daten.rahmen.value + document.daten.einhrahmen.value + "solid " + document.daten.farbe.value;
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<form name="daten">
<p>Breite
<input type="text" name="breite" size="4" span class="Normal">
<select name="einhbreite" style="width:55;" span class="Normal">
<option value="mm" selected>mm</option>
<option value="px">px</option>
</select>
Höhe
<input type="text" name="hoehe" size="4" span class="Normal">
<select name="einhhoehe" style="width:55;" span class="Normal">
<option value="mm" selected>mm</option>
<option value="px">px</option>
</select>
</p>
<p> Rahmen
<input type="text" name="rahmen" size="4" span class="Normal">
<select name="einhrahmen" style="width:50;" span class="Normal">
<option value="pt" selected>pt</option>
<option value="px">px</option>
</select>
Farbe
<select name="farbe" style="width:100;" span class="Normal">
<option value="black" selected>black</option>
<option value="gray" style="color:gray">gray</option>
<option value="maroon" style="color">maroon</option>
<option value="red" style="color:red">red</option>
<option value="green" style="color:green">green</option>
<option value="lime" style="color:lime">lime</option>
<option value="olive" style="color:olive">olive</option>
<option value="yellow" style="color:yellow">yellow</option>
<option value="navy" style="color:navy">navy</option>
<option value="blue" style="color:blue">blue</option>
<option value="purple" style="color:purple">purple</option>
<option value="fuchsia" style="color:fuchsia">fuchsia</option>
<option value="teal" style="color:teal">teal</option>
<option value="aqua" style="color:aqua">aqua</option>
<option value="silver" style="color:silver">silver</option>
</select>
</p>
<p>
<input type="button" name="aendern" value="Ändern" onClick="aendern()">
</p>
<div id=divEditable contenteditable style="height:350; width:100%; background-color:white; padding:0; border:1pt solid black; overflow=auto"; zoom:100%>
</div>
</form>

Ich war so stolz auf meinen eigenen Script !?
Wie muß außerdem der Script geändert werden (window.opener ), wenn ich die Parameter aus einem Popup heraus ändern möchte?

P.S. Ich habe den Script noch etwas vereinfacht, doch wie bisher, im Mac-IE O.K. und unter Windows nichts.

<script language="JavaScript">
function modifiziere() {
var rbreite = document.daten.breite.value + document.daten.einhbreite.value;
var rhoehe = document.daten.hoehe.value + document.daten.einhhoehe.value;
var dicke = document.daten.rahmen.value + document.daten.einhrahmen.value + "solid " + document.daten.farbe.value;
document.getElementById("divEditable").style.width = rbreite;
document.getElementById("divEditable").style.height = rhoehe;
document.getElementById("divEditable").style.border = dicke;
}
</script>
 
Zuletzt bearbeitet:
1.
dein "Ändern-Button" trägt den selben Namen wie die Funktion.... ich habs hier schon etliche male geschrieben.... (ich werd den Hinweis wohl in meine Sig aufnehmen :-) ).....
Seitenelementen sollte man nicht den selben Namen(oder ID) geben wie Javascript-Funktionen- oder Methoden.
Ändere den Namen des Buttons oder entferne ihn... soweit ich sehe, brauchst du ihn sowieso nicht.

2.
vor dem "solid " in der 2ten Zeile der Funktion fehlt ein Leerzeichen .... du erhältst damit Strings a'la "3ptsolid black" ...einen ungültigen Parameter.

3.
solltest du die Eingabe ungültiger Parameter in die Textfelder mit try/catch abfangen
Code: 
function aendern() {
try{window.document.getElementById("divEditable").style.width = document.daten.breite.value + document.daten.einhbreite.value;}catch(e){}
try{window.document.getElementById("divEditable").style.height = document.daten.hoehe.value + document.daten.einhhoehe.value;}catch(e){}
try{window.document.getElementById("divEditable").style.border = document.daten.rahmen.value + document.daten.einhrahmen.value + " solid " + document.daten.farbe.value;}catch(e){}
}

4.
Es sollte reichen, wenn du in der Funktion überall "document" durch "opener.document" ersetzt.
 
fatalus, Du bist der Größte

Ich hatte es schon aus lauter Verzweiflung mit dokument.all probiert:
Code: 
document.all["divEditable"].style.width = document.daten.breite.value + document.daten.einhbreite.value;
document.all["divEditable"].style.height = document.daten.hoehe.value + document.daten.einhhoehe.value;
document.all["divEditable"].style.border = document.daten.rahmen.value + document.daten.einhrahmen.value + "solid " + document.daten.farbe.value;

Doch auch da fehlte das Leerzeichen und der Schalter hatte den selben Namen wie die Funktion, auch das konnte nicht funktionieren. Da scheint der IE vom Mac wohl etwas großzügiger bei Fehlern zu sein.

Besten Dank.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück