Checkboxen über mehrere Arrays validieren? - Javascript, Jquery, Arrays, Kontrollkästchen

Ich habe ein Problem mit einer Website, die ich binversuchen zu bauen. Auf einer Seite der Website befindet sich ein "Filter", mit dem Benutzer die Kontrollkästchen in einer Liste aktivieren können, die die Ergebnisse ihrer Suche beeinflussen. Ich bin ein Neuling bei jQuery, aber ich habe es geschafft, genug Code zusammenzusetzen, damit dies funktioniert ... meist

Hier ist der Code, den ich bis jetzt habe:

/// Makes checkboxes in the filter add and remove the proper class based on whether they"re checked or not
$(".filterlist input:checkbox").click(function checkboxes(){
$thislist = $(this).closest(".filterlist li > ul");
$checkboxes = $thislist.closest("li > input:checkbox").serializeArray();
if($checkboxes.length < 1) {
$(this).closest("ul.filterlist > li").removeClass("itemselected");
}
else if($checkboxes.length > 0) {
$(this).closest("ul.filterlist > li").addClass("itemselected");
}
});

In meinem CSS ist "itemselected" die Klasse, die ich versuchehinzufügen. Das Problem ist, dass ich unter ".filterlist" mehr als eine Liste von Kontrollkästchen habe. Wenn ich die Kontrollkästchen in der ersten Liste ankreuze, wird die Klasse ordnungsgemäß hinzugefügt, und wenn ich alle in dieser Liste entferne, wird die Klasse ordnungsgemäß entfernt - sofern in der zweiten Liste nichts angekreuzt ist.

Dies liegt daran, dass ich nur ein Array verwende, aber ichIch kann nicht herausfinden, wie es dazu gebracht wird, für jede der Listen ein anderes Array zu erstellen, sodass die Klasse auch dann aus dem li in der zweiten Liste entfernt wird, wenn dort keine markiert sind, oder umgekehrt umgekehrt.

Tut mir leid, das ist eine so lange Frage, ich habe versucht, genau zu sein.

Vielen Dank im Voraus für alle Antworten! =]

Antworten:

etwas wie das??

$(document).ready(function(){
$("ul.filterlist input:checkbox").click(function () {
var ul = $(this).parent().parent();
if ( ul.find("input:checked").length == 0 ) {
ul.parent().removeClass("itemselected");
} else {
ul.parent().addClass("itemselected");
}
});
});