molily: Checkboxen überwachen

Beitrag lesen

Beispiel-HTML:

<ul id="checkboxen">  
<li><input type="checkbox"></li>  
<li><input type="checkbox"></li>  
<li><input type="checkbox"></li>  
<li><input type="checkbox"></li>  
<li><input type="checkbox"></li>  
<li><input type="checkbox"></li>  
...  
</ul>

Erste Möglichkeit:
Bei jedem input-Element in der Liste einen eigenen click-Handler registrieren.

document.observe("dom:loaded", function() {  
	function checkboxKlick (event) {  
		alert(this.checked);  
	}  
	$$("#checkboxen input[type=checkbox]").each(function (el) {  
		el.observe('click', checkboxKlick);  
	});  
});

Zweite Möglichkeit:
Event-Delegation, d.h. bei einem Vorfahrenelement alle Klicks seiner Nachfahrenelemente verarbeiten und in der Handler-Funktion prüfen, ob ein input-Element geklickt wurde:

document.observe("dom:loaded", function() {  
	$("checkboxen").observe('click', function (event) {  
		var target = event.element();  
		if (!target.match("input[type=checkbox]")) return;  
		alert(target.checked);  
	});  
});

Das würde ich empfehlen. (Es gibt mittlerweile auch Prototype-Erweiterungen für Event-Delegation.)

Mathias