1. Vorgänge im Zusammenhang mit der Verbindungsauswahl im Kontrollkästchen
<input type="checkbox" id="ckb_1" /> <input type="checkbox" id="ckb_2" disabled="true" /> <input type="checkbox" id="ckb_3" /> <input type="checkbox" id="ckb_4" /> <input type="button" id="btn" value="点击">
Beispiel: Sie müssen das Kontrollkästchen „Elementtyp“ und „verfügbar“ auf „ausgewählt“ setzen
Methode ① Verwenden Sie den Attributfilterselektor [type='checkbox'] und [disabled!=disabled]
$("input[type='checkbox'][disabled!=disabled]").attr("checked",true);
Beachten Sie, dass in diesem zusammengesetzten Selektor „disabled!=disabled“ verwendet werden sollte, um „verfügbare“ Elemente auszuwählen, und attr(“checked“,true) beim Festlegen von Attributen verwendet werden sollte. Das Attribut „disabled“ wird ähnlich wie das Attribut „checked“ verwendet.
Methode ②Formularauswahl verwenden: Kontrollkästchen und Attributfilterauswahl [deaktiviert!=deaktiviert]
$('input:checkbox[disabled!=disabled]').attr("checked",true);
Methode ③ Verwenden Sie den Formularselektor :Kontrollkästchen und den Formularobjektattributfilterselektor :aktiviert
$(':checkbox:enabled').attr("checked",true);
Methode ④ Verwenden Sie .each(), um
zu durchlaufen$("input[type=checkbox]").each(function(){ if ($(this).attr("disabled") != "disabled") { $(this).attr("checked",true); } });
Es wird kein zusammengesetzter Selektor verwendet. Was zu beachten ist, ist dasselbe wie bei Methode ①. Bei der Beurteilung des Attributs sollten Sie beurteilen, ob es „deaktiviert“ oder „aktiviert“ ist, nicht falsch oder wahr. Beim Festlegen von Eigenschaften können Sie „disabled“ oder „enable“ oder „false“ oder „true“ verwenden.
2. Weitere Beispiele für zusammengesetzte Selektoren
<ul> <li >第一行</li> <li class="showli">第二行</li> <li class="showli">第三行</li> <li>第四行</li> <li style="display:none">第五行</li> <li class="showli">第六行</li> <li>第七行</li> </ul>
Beispiel: Setzen Sie den Hintergrund des ersten li-Elements mit der Klasse showli auf rot
$("ul li[class=showli]:eq(0)").css("background":"red");
Das Ergebnis ist, dass der Hintergrund von „
Beispiel: Stellen Sie den Hintergrund des fünften sichtbaren Li auf Rot ein
$("ul li:visible:eq(4)").css({"display":"blaock","background":"red"});
Das Ergebnis ist, dass der Hintergrund von „
Beispiel. (Es ist ziemlich kompliziert) Setzen Sie den Hintergrund des zweiten Li, das hinter dem zweiten Li sichtbar ist, mit der Klasse showli auf Rot
$("ul li.showli:eq(1)").nextAll("li:visible:eq(1)").css({"display":"block","background":"red"});
Das Ergebnis ist, dass der Hintergrund von „