jQueryは、チェックされたチェックボックスの数を数えます

jqueryを使用して、テーブルのチェックボックスの数を数えます

以下は、テーブルで選択されたチェックボックスの数を数えるための簡単なjQueryコードスニペットです。

$('#table :input[type="checkbox"]:checked').length

メソッドを使用してすべてのチェックボックスを選択し、querySelectorAllメソッドを使用して、選択したチェックボックスを除外します。簡単な例を次に示します：Array.prototype.filter

let checkboxes = document.querySelectorAll('input[type="checkbox"]');
let checked = Array.from(checkboxes).filter(input => input.checked);
console.log(checked.length);

イベントを使用して、チェックボックスの数をリアルタイムでカウントできます。このイベントは、チェックボックスのステータスが変更されるたびにトリガーされます。このイベントを使用して、チェックボックスが選択またはチェックされていないときにカウントを更新できます。例は次のとおりです。.change()

$('input[type="checkbox"]').change(function() {
  let count = $('input[type="checkbox"]:checked').length;
  console.log(count);
});

$('input[type="checkbox"]').change(function() {
  let count = $('input[type="checkbox"]:checked').length;
  $('#count').text(count);
});

#count特定のグループで選択されたチェックボックスの数をカウントする方法は？

はい、より具体的なセレクターを使用して、特定のグループで選択されたチェックボックスの数をカウントできます。たとえば、チェックボックスがID

group1このコードは、

$('div#group1 input[type="checkbox"]').change(function() {
  let count = $('div#group1 input[type="checkbox"]:checked').length;
  console.log(count);
});

チェックされていないチェックボックスの数をカウントする方法は？ group1

セレクターを使用して、チェックされていないチェックボックスの数をカウントできます。例は次のとおりです。

:not(:checked)このコードは、コンソールにチェックされていないチェックボックスの数を記録します。

以上がjQueryは、チェックされたチェックボックスの数を数えますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。