Question

当用户点击“全部”按钮时，我正在尝试检查所有复选框（true）。我试过这个，首先只是为了看看是否可以点击“全部”来检查“Anglais”：

<input type="checkbox" name="anglais"  id="anglais"  value="Anglais"  /> Anglais
<input type="checkbox" name="allemand" id="allemand" value="Allemand" /> Allemand
<input type="checkbox" name="espagnol" id="espagnol" value="Espagnol" /> Espagnol
<input type="checkbox" name="francais" id="francais" value="Francais" /> Francais
<input type="checkbox" onclick="checkedAll()" name="all"      id="all"      value="Tous"     /> Tous

我的Javascript：

function checkedAll () {
var checked = false;
var all = document.getElementById('all');
if (checked == false) {
    checked = true
}
else {
    checked = false
}
var ang = document.getElementById('anglais').checked
if (ang == true) {
    ang.checked = true;
    }

但是当我点击All时，不会检查按钮。我想我不明白如何使用.checked方法。
也许，我的一些代码没有逻辑，因为它来自这个例子： https://www.hscripts.com/scripts/JavaScript/select-all-checkbox.php

Answer 1

夫妻修改：

将all复选框传递给checkedAll方法（这样您就可以引用它而无需重新找到它）。
使用document.getElementsByTagName查找其他复选框，但您可以轻松地为每个复选框使用document.getElementById（anglais，allemand等。）
将其他每个复选框的checked状态设置为all.checked值。无需进行真/假比较。

＆＃13;

function checkedAll(allCheckbox){
  var allCheckboxes = document.getElementsByTagName('input');
  for (var i = 0; i < allCheckboxes.length; i++){
    var curCheckbox = allCheckboxes[i];
    if (curCheckbox.id != 'all'){
      curCheckbox.checked = allCheckbox.checked;
    }
  }
}

＆＃13;

<input type="checkbox" name="anglais"  id="anglais"  value="Anglais"  /> Anglais
<input type="checkbox" name="allemand" id="allemand" value="Allemand" /> Allemand
<input type="checkbox" name="espagnol" id="espagnol" value="Espagnol" /> Espagnol
<input type="checkbox" name="francais" id="francais" value="Francais" /> Francais
<input type="checkbox" onclick="checkedAll(this)" name="all" id="all" value="Tous" /> Tous

＆＃13;

更明确的方式是：

＆＃13;

function checkedAll(){
  var isAllChecked = document.getElementById('all').checked;
  
  // Set the other checkboxes .checked property based on the
  // .checked status of the `all` checkbox
  document.getElementById('anglais').checked = isAllChecked;
  document.getElementById('allemand').checked = isAllChecked;
  document.getElementById('espagnol').checked = isAllChecked;
  document.getElementById('francais').checked = isAllChecked;
}

＆＃13;

<input type="checkbox" name="anglais"  id="anglais"  value="Anglais"  /> Anglais
<input type="checkbox" name="allemand" id="allemand" value="Allemand" /> Allemand
<input type="checkbox" name="espagnol" id="espagnol" value="Espagnol" /> Espagnol
<input type="checkbox" name="francais" id="francais" value="Francais" /> Francais
<input type="checkbox" onclick="checkedAll()" name="all" id="all" value="Tous" /> Tous

＆＃13;

选中所有复选框javascript

1 个答案: