Question

当我尝试通过Javascript标记“已选中”复选框时，我遇到了问题。我正在分享它的小提琴链接。我想用普通的Javascript而不是JQuery来做。

[Fiddle link]http://jsfiddle.net/vineetgnair/pne58wyh/

感谢您的帮助

Answer 1

var checkBox = document.querySelectorAll('input[type=checkbox]');

// querySelectorAll returns an array of the matching elements

function selectAll() {
  for (i = 0; i < checkBox.length; i++) {
    // loop through and set "checked" to TRUE on every element in the checkBox array
    checkBox[i].checked = true;
  }
}

function deselectAll() {
  // loop through and set "checked" to FALSE on every element in the checkBox array
  for (i = 0; i < checkBox.length; i++) {
    checkBox[i].checked = false;
  }
}

<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<br>
<input type="button" value="Select All" onclick="selectAll()">
<input type="button" value="Deselect All" onclick="deselectAll()">

Answer 2

除了我在selectAll函数中添加了一个参数

之外，HTML几乎一样

<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<br>
<input type="button" value="Select All" onclick="selectAll(true)">
<input type="button" value="Deselect All" onclick="selectAll(false)">

对于javascript，您只需要一个循环来将所有项目设置为选中或取消选中

function selectAll(selected) {
    var checkBox = document.querySelectorAll('input[type=checkbox]');

    for(var i = 0 ; i < checkBox.length ; i++) {
        checkBox[i].checked = selected;
    } 
}

jsFiddle

复选框：使用Javascript检查而不是JQuery

2 个答案: