Eigenschaften dynamisch ändern

rernanded

Erfahrenes Mitglied
Hallo

ich möchte gerne die Eigenschaften von input name "eins" dynamisch ändern (zB die background-color):

HTML:
<style type="text/css">
<!--
#input1 {
background-color: #000000;
}
-->
</style>
<script type="text/javascript">
var farbe = new Array();
farbe[0] = ''
farbe[1] = 'yellow';
farbe[2] = 'green';
farbe[3] = 'red';
farbe[4] = 'blue';
farbe[5] = 'white';
farbe[6] = 'orange';
function laden() {
  if (document.eins.auswahl.selectedIndex > 0) {
  document.getElementById('input1').style.backgroundColor = farbe[document.eins.auswahl.selectedIndex];
  }
}
</script>
</head>
<body >

<form action="" name="formular">
<fieldset>
<legend>wähle eine Hintergrundfarbe</legend>
<label>wähle</label>
<select name="auswahl" onchange="laden()">
  <option value="default"></option>
  <option>Gelb</option>
  <option>Grün</option>
  <option>Rot</option>
  <option>Blau</option>
  <option>Weiß</option>
  <option>Orange</option>
  </select>
</fieldset>
</form>

<input type="text" id="input1" name="eins" value="Hein Blöd">

Aber irgendwie komme ich mit dem onchange="laden()" etc. nicht klar. Brauche Tipp wo hier der Fehler liegt. Und wie ich noch die Änderung der Schriftgröße und Schriftfarbe dynamisch vornehmen kann. Danke.

Moni.
 
Du sprichst das Formular falsch an.

Siehe http://wiki.selfhtml.org/wiki/JavaScript/Objekte/DOM/document/forms

Aus:
Javascript:
if (document.eins.auswahl.selectedIndex > 0) {
  document.getElementById('input1').style.backgroundColor = farbe[document.eins.auswahl.selectedIndex];
  }
wird:
Javascript:
if (document.formular.auswahl.selectedIndex > 0) {
  document.getElementById('input1').style.backgroundColor = farbe[document.formular.auswahl.selectedIndex];
}
Und für valides HTML gehört <input> in <form>...</form> eingebettet.
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück