Checkbox in nicht sichtbarer Tabellenzeile ansprechen

[Rolf B]

Hallo Jörg,

ohne Kenntnis Deiner Seite lässt sich da wenig sagen.

Aber eins fällt mir gerade auf:

$(".myElement") liefert ein wrapped set aller Elemente mit dieser Klasse. Wenn Du also eine Tabelle mit drölftausend Zeilen hast und die Checkbox darin jeweils die Klasse "myElement" hat, liefert $(".myElement") drölftausend Checkboxen.

$(".myElement").is(":visible") prüft, ob irgendein Element im matched set sichtbar ist. Hast Du 1000 Zeilen und eine ist sichtbar, ist is(":visible") immer noch true.

$(".myElement").prop("checked") liefert das checked-Property des ersten Eintrags in diesem wrapped set

$(".myElement").prop("checked", true) setzt das checked-Property für alle Einträge in diesem wrapped set

Offenbar soll ein Klick auf .My_all_Check den Check-Status aller sichtbaren Checkboxen invertieren. Was zum Namen "My_all_Check" nicht ganz passt, aber das sei mal dahingestellt. Damit das gelingt, musst Du die relevanten Checkboxen einzeln verarbeiten.

$(".myElement:visible").each(function(element) {
   // element ist jetzt kein wrapped set, sondern ein HTML Element
   element.checked = !element.checked;
});

Ich hab das noch rot gemacht. Aus Gründen.

1. Dieser Code setzt voraus, dass nur Checkboxen die myElement-Klasse haben. Man sollte das durch einen passenden Selektor klarer machen

2. :visible ist kein Selektor des Browsers, sondern der Sizzle-Engine von jQuery. Wird er verwendet, kann jQuery nicht mehr auf querySelector zurückgreifen, sondern muss die Elemente von Hand gegen den Selektor matchen. Das ist deutlich langsamer. Die jQuery Doku empfiehlt, dies nicht zu tun. Statt dessen soll man zunächst so selektieren, dass nur Browser-Selektoren verwendet werden, und dann nachfiltern.

$("input[type=checkbox].myElement")
   .filter(":visible")
   .each(function(element) {
       element.checked = !element.checked;
   });

wäre also deutlich performanter. Und ich würde es so programmieren:

for (let element of document.querySelectorAll("input[type=checkbox].myElement")) {
   if (element.style.display != 'none')
       element.checked = !element.checked;
};

Funktioniert in allen halbwegs aktuellen Browsern. Es setzt voraus, dass Du mit style="display:none" ausblendet. Tust Du es anders, muss die Abfrage sich natürlich ändern.

Wenn Du zum Ausblenden eine Klasse verwendest, wie heute nachmittag beschrieben, kannst Du diese Klasse gleich in querySelectorAll verwenden und brauchst gar keinen if.

Ich habe ein Problem. Ich löse es mit X. Jetzt habe ich zwei Probleme.

Dieser Satz gilt (mindestens) für X=Regex und X=jQuery. Manchmal auch für X="einer Frage bei Selfhtml" 😉.

Rolf