jQuery实现复选框的全选和反选

2019-11-19 17:46:03

字体：大中小

来源：转载

供稿：网友

话不多说，请看代码

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <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="全选" onclick="allPick()"> <input type="button" value="全不选" onclick="unAllPick()"> <input type="button" value="反转" onclick="inverserPick()"> </form> <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <script> // 全选 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;  }) } </script></body></html>

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持武林网！

上一篇：JS实现购物车特效

下一篇：jQuery制作图片旋转效果