dedlfix: Quiz - Event-Handler dynamisch anbinden

Beitrag lesen

problematische Seite

Tach!

Z.20: Ist das quiz-Object so logisch?

Was für Bedenken hast du denn? Es erfüllt doch die Aufgabenstellung, oder nicht?

var quiz = new Object();
    quiz.question   = 'Was ist die Hauptstadt von Deutschland?';
    quiz.solution   = 'Berlin';
    quiz.options    = ['Berlin', 'Hamburg', 'München', 'Hannover'];

Man könnte vielleicht ändern, ein Objekt-Literal zu verwenden. Außerdem ist das Lösungswort redundant. Mit einem Verweis auf den Index des Options-Arrays könnte man sich das sparen.

z.52: Ich würde gerne den neu erzeugten Elementen eine Klasse oder einen Event-Handler geben. Wie geht das?

	for (index = 0; index < quiz.options.length; index++) {
	    text = quiz.options[index];
		newElement = addAChild('a', text);
		//newElement.className = "foo";
	}

Ich hatte dafür das a-Element gewählt, da ich dachte, dass man es dann auch durchtabben kann. Dafür benötigt es aber wohl noch ein href="#", oder?

Lässt sich tabindex nicht verwenden? Und sind das nicht eher Buttons als Links?

Wie kann ich hier eine Klickfunktionalität erreichen? Wenn ich die Variable newElement noch einmal verwende, bricht die Schleife ab.

Das macht sie nicht einfach so, sondern beschwert sich sicherlich über eine bestimmte Situation. Schau erstmal in der Konsole der Entwicklertools deines Browsers nach. Dann wirst du etwas feststellen und weitere Fragen bekommen.

  //...
  var element = document.getElementById('quiz');
  element.addEventListener('click',function(){clickHandler(event);});
}

function clickHandler(event) {
//...

Um den Event mit target zu identifizieren, benötige ich doch das Event, oder? Wie kann ich das übergeben?

Erstmal musst du es übernehmen. Das ist nicht einfach so auf magische Weise da, sondern wird dem Eventhandler übergeben. Das ist deine anonyme Funktion, und die nimmt nichts entgegen.

Die ist eigentlich auch überflüssig. Es reicht bei diesem einfachen Handler, dass du clickHandler direkt referenzierst. Diese Funktion nimmt ja auch ein Argument entgegen.

dedlfix.