源于生活

标题: jQuery实现复选框的全选和反选 [打印本页]

作者: vingoo    时间: 2017-2-14 04:28
标题: jQuery实现复选框的全选和反选
[HTML] 纯文本查看 复制代码
<form>
  <label for="apple">苹果</label>
  <input type="checkbox" name="apple">
  <label for="banana">香蕉</label>
  <input type="checkbox" name="banana">
  <label for="orange">橘子</label>
  <input type="checkbox" name="orange">
  <input type="button" value="全选">
  <input type="button" value="全不选">
  <input type="button" value="反转">
</form>


[JavaScript] 纯文本查看 复制代码
// 全选
function allPick() {
    $("[type=checkbox]:checkbox").each(function() {
        this.checked = true;
    })
}
// 全不选
function unAllPick() {
    $("[type=checkbox]:checkbox").each(function() {
        this.checked = false;
    })
}
// 反转
function inverserPick() {
    $("[type=checkbox]:checkbox").each(function() {
        this.checked = !this.checked;
    })
}



请自觉引用jquery库





欢迎光临 源于生活 (http://bbs.vingoo.info/) Powered by Discuz! X3.1