So beheben Sie den zweiten Fehler von JQuery Select/Inverse Selection

Kürzlich bin ich im Projekt auf ein Problem gestoßen. Beim Testen der Funktion „Auswählen/Auswählen aufheben“ kann der Status „Alles ausgewählt/nicht ausgewählt“ des Unterfelds synchronisiert werden. Wenn dann auf das übergeordnete Feld geklickt wird, reagiert der Unterrahmen nicht mehr. In diesem Artikel finden Sie einen Artikel zur Lösung des Problems, dass die vollständige Auswahl/inverse Auswahl von JQuery zum zweiten Mal fehlschlägt. Der Herausgeber findet es ziemlich gut, deshalb teile ich es jetzt mit Ihnen und gebe es als Referenz. Folgen wir dem Herausgeber und werfen wir einen Blick darauf. Ich hoffe, es kann allen helfen.

Die Schlüsselstruktur des Originalcodes ist wie folgt:

function selectAll(obj){
    $('input[name="xxx[]"]').attr("checked",obj.checked);
}

<input type="checkbox" id="mother" name="mother" onclick="selectAll(this);"/>全选

<input type="checkbox" id="son1" name="xxx[]" />子框<input type="checkbox" id="son2" name="xxx[]" />子框<input type="checkbox" id="son3" name="xxx[]" />子框<input type="checkbox" id="son4" name="xxx[]" />子框

Schritt 1: Versuchen Sie es mit einer Front-on-Welle:

function selectAll(obj){
   if(obj.checked) {
    $('input[name="xxx[]"]').attr("checked", true);
   } else {
    $('input[name="xxx[]"]').removeAttr("checked");
   }
}

Pawn---- -Hat überhaupt keine Wirkung, lass es.

Schritt 2: Eine schnelle Online-Suche und festgestellt, dass dieses Problem relativ häufig vorkommt. Unter den Menschen, die auf dieses Problem gestoßen sind, sollte ich Tausende von Kilometern entfernt sein. Ich habe ein paar durchgeklickt und im Grunde gesagt, dass die Verwendung von prop anstelle von attr das Problem lösen kann. Die Lösung lautet wie folgt:

Die im Projekt verwendete Version ist jedoch niedriger als 1.6 und mir wurde gesagt, dass es am besten ist, die Version nicht zu ändern und zu verwerfen.

Schritt 3: Ich habe keine andere Wahl, als JQuery aufzugeben ... Versuchen Sie, die native JS-Schreibmethode zu verwenden. Der Code lautet wie folgt:

function selectAll(obj){
 var xxx = document.getElementsByName("xxx[]");
  if(obj.checked) {
   for(var i = 0;i < xxx.length;i++) {
    xxx[i].checked = true;
   }
  } else {
   for(var i = 0;i < xxx.length;i++) {
    xxx[i].checked = false;
   }
  }
}

Testen Sie es und lösen Sie es reibungslos. Tatsächlich ist es ein kleines Problem, aber es hat mir einige Inspiration gegeben. Wenn ich das Problem aus einem anderen Blickwinkel betrachte, kann ich es oft besser lösen.

Verwandte Empfehlungen:

js-Implementierung zum Auswählen aller und Aufheben der Auswahl

So wählen Sie alle Kontrollkästchen in js aus und invertieren sie

Js implementiert die vollständige Front-End-Auswahl und die inverse Auswahl

Das obige ist der detaillierte Inhalt vonSo beheben Sie den zweiten Fehler von JQuery Select/Inverse Selection. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!