Bild wird nicht angezeigt

Question

Hallo vielen Dank. Nun versuche ich jedoch verzweifelt, dass sich beim Auswählen der Farbe das Bild ändert. Der value=1 der frage CD01 ist "Schwarz". Hier mein Code:

<script>
   var dropdown = document.getElementById("CD01");
   var bild = document.getElementById("car");
    
   function toogle() {
     if (dropdown.value == "1") {
       document.getElementById("car").src="car_black.png";
     }
   }
    
   SoSciTools.attachEvent(dropdown, "change", toogle);
   SoSciTools.attachEvent(dropdown, "click", toogle);
   toogle();
</script>

Bitte um dringende Hilfe!

Comments

> Nun versuche ich jedoch verzweifelt, dass sich beim Auswählen der Farbe das Bild ändert.

Leider sind Sie bisher sehr vage, was Se mit "ändern" meinen. Sie möchten unterschiedliche Bilder anzeigen, korrekt?

Was zeigt denn die JavaScript-Fehlerkonsole im Browser, wenn Sie im Dropdown etwas auswählen?

Möchten Sie vielleicht einen Pretest-Link direkt (!) zur betroffenen Fragebogen-Seite posten?

---

hallo,

also mit ändern ist gemeint, dass wenn der user auf eine option des dropdown menüs klickt soll sich die farbe des autos ändern - also ja, ich möchte unterschiedliche bilder anzeigen lassen, basierend auf der dropdown auswahl.

die konsole zeigt mir leider nichts an!

hier der link zum pretest: https://www.soscisurvey.de/digitalnudging_defaultsettings/?act=tJO8cBXr9XW2e8AqwjZ1Iupw

vielen dank für die hilfe schon im voraus!

Answer 1

die konsole zeigt mir leider nichts an!

In Firefox ist die Fehlerkonsole nicht so sparsam mit Meldungen:

Ich gehe davon aus, dass die Einbindung von Google-Fonts auch in Chrome und Edge blockiert wird. Immerhin muss Google ja nicht mehr Daten über Ihre Teilnehmer sammeln als Sie in der Datenschutz-Information erklärt haben.

Für Ihr Script relevant ist aber die letzte Meldung. Demnach funktioniert das attachEvent() nicht, weil kein Element gefunden wurde.

 SoSciTools.attachEvent(dropdown, "change", toogle);
 SoSciTools.attachEvent(dropdown, "click", toogle);

Demnach muss es an der Variable dropdown liegen. Und in der Tat ist diese laut JavaScript-Konsole im Browser null. Dabei sieht das erst mal gut aus:

var dropdown = document.getElementById("CD01");

Und das funktioniert in der JS-Konsole auch korrekt. Ich musste tatsächlich eine Weile suchen, um das Problem zu finden: Sie haben den JavaScript-Code schlicht und ergreifend zu weit oben im Fragebogen eingebunden.

Damit das getElementById() das Dropdown finden kann, muss es im HTML-Dokument schon geladen sein, wenn das Script ausgeführt wird. Wenn das Script über dem Dropdown steht, ist das nicht der Fall.

Lösung: Ziehen Sie den HTML-Code mit dem Script einfach ans Ende der Seite.

Comments

guten morgen.

oh gott. vielen lieben dank!!!!!!! es funktioniert nun einwandfrei!!!!!

vielen vielen vielen dank!!!