他のチェックボックスを制御する「すべて選択」チェックボックスを作成するにはどうすればよいですか?

他のすべてのチェックボックスを選択するチェックボックスを実装する方法

HTML で「すべて選択」チェックボックスを実装すると、選択したチェックボックスを簡単に切り替えることができます上の他の複数のチェックボックスの状態

解決策:

この機能を実現するには:

1. 次の JavaScript コードを使用してスクリプト タグを作成します:

<script>
function toggle(source) {
  const checkboxes = document.getElementsByName('foo');
  for (let i = 0; i < checkboxes.length; i++) {
    checkboxes[i].checked = source.checked;
  }
}
</script>

2. HTML ドキュメントで、次のコードを「すべて選択」チェックボックスを作成します:

<input type="checkbox" onClick="toggle(this)" /> Toggle All<br />

3. 個々のチェックボックスに次のコードを追加します:

<input type="checkbox" name="foo" value="bar1"> Bar 1<br />
<input type="checkbox" name="foo" value="bar2"> Bar 2<br />
<input type="checkbox" name="foo" value="bar3"> Bar 3<br />
<input type="checkbox" name="foo" value="bar4"> Bar 4<br />

「選択」をクリックしたときすべて」チェックボックスをオンにすると、スクリプトは「foo」という名前のすべてのチェックボックスをループし、チェックされたプロパティを「すべて選択」のチェックされた状態と一致するように設定します。チェックボックス。

以上が他のチェックボックスを制御する「すべて選択」チェックボックスを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。