JQuery のすべての選択の逆選択 2 番目の失敗の解決策

この記事は主にJQueryの全選択・逆選択が2回目で失敗する問題を解決する記事をお届けします。編集者はこれがとても良いものだと思ったので、皆さんの参考として今から共有します。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。

最近、プロジェクトで選択/選択解除機能をテストしているときに、親ボックスを初めて選択/選択解除したときに、サブボックスの全選択/非選択状態が同期されるという問題が発生しました。親ボックスをクリックすると、サブフレームが応答しなくなります。

元のコードの大まかな構造の鍵は次のとおりです:

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[]" />子框

ステップ 1: ポジティブな波を試してください:

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

Pale ----- まったく効果がありません。放棄してください。

ステップ 2: インターネットで簡単に検索したところ、この問題は数千マイル離れた場所でも発生していることがわかりました。いくつかをクリックして調べてみると、基本的には attr の代わりに prop を使用すると問題を解決できるとのことでしたが、解決策は次のとおりです:

ただし、プロジェクトで使用されているバージョンは 1.6 よりも低く、バージョンは変えない方が良いと言われたので断念しました。

ステップ 3: JQuery を放棄するしかありません...ネイティブの JS 記述方法を使用してみてください。 コードは次のとおりです:

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;
   }
  }
}

テストしてスムーズに解決します。実際、これは小さな問題ですが、この問題を 1 つの枠に限定することはできず、別の角度から考えると、より適切に問題を解決できることがよくあります。

関連する推奨事項:

jquery の全選択と選択を反転する例を共有する

jquery すべて選択/選択なし/選択を反転する別の実装方法 (ネイティブ JS を使用)_jquery

jquery 全選択 checkBox 関数の実装コード(全選択機能をキャンセル)_jquery

以上がJQuery のすべての選択の逆選択 2 番目の失敗の解決策の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。