如何建立控制其他複選框的'全選”複選框？

如何實作選取所有其他複選框的複選框

在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中文網其他相關文章！