Problem mit getElementsByClassName

rernanded

rernanded

Erfahrenes Mitglied
Hi habe Probleme mit getElementsByClassName. ich kriegs nicht hin dass die Elemente mit der class="dragme" alle eine andere Farbe aus der selectbox (formular2 auswahl2) kriegen.

Moni

HTML: 
<head>

<script type="text/javascript">
var hintergrundfarbe = new Array();
hintergrundfarbe[0] = ''
hintergrundfarbe[1] = 'white';
hintergrundfarbe[2] = 'green';
hintergrundfarbe[3] = 'red';
hintergrundfarbe[4] = 'blue';
hintergrundfarbe[5] = 'yellow';
hintergrundfarbe[6] = 'orange';
function laden() {
  if (document.formular1.auswahl1.selectedIndex > 0) {
  document.getElementById('hintergrund').style.backgroundColor = hintergrundfarbe[document.formular1.auswahl1.selectedIndex];
  }
}
</script>



<script>
function hintergrundfarbedragme() {
var x = document.getElementsByClassName("dragme");
var i;
for (i = 0; i < x.length; i++) {
  x[i].style.backgroundColor = x[document.formular2.auswahl2.selectedIndex];
}
}
</script>


</head>
<body id="hintergrund">

<form action="" name="formular1">
Hintergrundfarbe<br />
<select name="auswahl1" onchange="laden()">
  <option value="default"></option>
  <option>Weiß</option>
  <option>Grün</option>
  <option>Rot</option>
  <option>Blau</option>
  <option>Gelb</option>
  <option>Orange</option>
  </select>
</form>
<br />

<form action="" name="formular2">
Hintergrundfarbe der Objekte<br />
<select name="auswahl2" onchange="hintergrundfarbedragme()">
  <option value="default"></option>
  <option>Weiß</option>
  <option>Grün</option>
  <option>Rot</option>
  <option>Blau</option>
  <option>Gelb</option>
  <option>Orange</option>
  </select>
</form>

<br />

<input type="text" class="dragme" name="input_eins" value="wow" style="text-align: center; BACKGROUND-COLOR: #ffffff; BORDER-TOP: 0px solid; BORDER-BOTTOM: 0px solid; BORDER-LEFT: 0px solid; BORDER-RIGHT: 0px solid; color: black; font-family: arial; font-size: 30pt;" />

<br />

<input type="text" class="dragme" name="input_zwei" value="wow" style="text-align: center; BACKGROUND-COLOR: #ffffff; BORDER-TOP: 0px solid; BORDER-BOTTOM: 0px solid; BORDER-LEFT: 0px solid; BORDER-RIGHT: 0px solid; color: black; font-family: arial; font-size: 30pt;" />

<br />

<textarea class="dragme" name="textarea_eins" style="text-align: center; BACKGROUND-COLOR: #ffffff; BORDER-TOP: 0px solid; BORDER-BOTTOM: 0px solid; BORDER-LEFT: 0px solid; BORDER-RIGHT: 0px solid; color: black; font-family: arial; font-size: 30pt;">wow</textarea>




</body>
 
rernanded hat gesagt.:
habe Probleme mit getElementsByClassName. ich kriegs nicht hin dass die Elemente mit der class="dragme" alle eine andere Farbe aus der selectbox (formular2 auswahl2) kriegen.
Zum Vergrößern anklicken....
Ein Problem mit getElementsByClassName kann ich hier nicht registrieren ;)

Vielmehr ist das zweite Script zum einen unvollständig, was die Definitionen der einzelnen Hintergrundfarben betrifft, und zum anderen an einer Stelle fehlerhaft.
Javascript: 
/* Zweites Script */
var hintergrundfarbe = new Array();
hintergrundfarbe[0] = ''
hintergrundfarbe[1] = 'white';
hintergrundfarbe[2] = 'green';
hintergrundfarbe[3] = 'red';
hintergrundfarbe[4] = 'blue';
hintergrundfarbe[5] = 'yellow';
hintergrundfarbe[6] = 'orange';
function hintergrundfarbedragme() {
  var x = document.getElementsByClassName("dragme");
  var i;
  for (i = 0; i < x.length; i++) {
    x[i].style.backgroundColor = hintergrundfarbe[document.formular2.auswahl2.selectedIndex];
  }
}
rernanded hat gesagt.:
@SpiceLab
Danke Dir - ging ja fix.
Zum Vergrößern anklicken....
Und wieder ging das fix :D
[edit]Tipp-Ex[/edit]​
 
Zuletzt bearbeitet:
@SpiceLab
Jau stimmt ;) und wieder fix ein dickes Danke. Tja da hab ich wohl das array komplett vergessen - OOPS. An dem kleinen Fehler (x[document. ...) hatte ich schon gedoktert, aber wenn das array fehlt kann ich kann solange doktern wie ich will.
js ist irgendwie nicht mein Ding, ich weiß auch nicht. Nice weekend. Moni
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück