选中修改切换复选框脚本取消选中所有复选框

时间:2017-05-05 08:42:40

标签: javascript

我有以下可运作的脚本

    function toggle_checkboxes(id) {
        if (!document.getElementById) {
            return;
        }
        if (!document.getElementsByTagName) {
            return;
        }
        var inputs = document.getElementById(id).getElementsByTagName("input");
        for (var x = 0; x < inputs.length; x++) {
            if (inputs[x].type == 'checkbox') { 
                inputs[x].checked = !inputs[x].checked;
            }
        }
    }

脚本按照说法执行操作:切换复选框状态。我修改现有脚本以选中/取消选中所有复选框。我怎么能这样做?

我试过

inputs[x].checked = false;
inputs[x].removeAttr('checked');

但它没有用。任何人吗?

1 个答案:

答案 0 :(得分:2)

你差不多了。你只需要这样做:

inputs[x].removeAttribute('checked');

函数removeAttr()是jQuery中使用的等价函数。此外,您不需要额外的参数id

&#13;
&#13;
function toggle_checkboxes(id) {
  var inputs = document.getElementById(id).getElementsByTagName("input");
  for (var x = 0; x < inputs.length; x++) {
    if (inputs[x].type == 'checkbox') {
      inputs[x].checked = !inputs[x].checked;
    }
  }
}
function uncheck_checkboxes(id) {
  var inputs = document.getElementById(id).getElementsByTagName("input");
  for (var x = 0; x < inputs.length; x++) {
    if (inputs[x].type == 'checkbox') {
      inputs[x].checked = false;
    }
  }
}
function check_checkboxes(id) {
  var inputs = document.getElementById(id).getElementsByTagName("input");
  for (var x = 0; x < inputs.length; x++) {
    if (inputs[x].type == 'checkbox') {
      inputs[x].checked = true;
    }
  }
}
&#13;
<div id="chks">
  <label><input type="checkbox" name="" /> Check 1</label>
  <br>
  <label><input type="checkbox" name="" checked /> Check 2</label>
  <br>
  <label><input type="checkbox" name="" /> Check 3</label>
  <br>
  <label><input type="checkbox" name="" checked /> Check 4</label>
  <br>
  <label><input type="checkbox" name="" /> Check 5</label>
  <br>
</div>
<input type="button" value="Toggle" onclick='toggle_checkboxes("chks");' />
<input type="button" value="Uncheck All" onclick='uncheck_checkboxes("chks");' />
<input type="button" value="check All" onclick='check_checkboxes("chks");' />
&#13;
&#13;
&#13;