jQuery Checkbox 全选 反选的简单实例

17、雨 "哗哗…… "地下起来,就像一个庞大的乐队在地上、空中、屋顶上演奏着秋的交响曲!行道树叶——梧桐叶也伴着秋雨在天空中飘荡,像几只飞舞的蝴蝶在天空中嬉戏!终于,它们飘累了,慢慢地落在了湿漉漉的水泥地上。远远的望去,就像是土地上的几朵小花,给寂寞的秋天增添了几分情趣!

1.全选、反选

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script src="http://xiazai.haodaima.com/201611/yuanma/jquery(haodaima.com).rar"></script>
 <script type="text/javascript">
  $(function () {
   $("#selall").on("click", function () { $("#plalst :checkbox").prop("checked", true); });
   $("#selnone").on("click", function () { $("#plalst :checkbox").prop("checked", false); });
   $("#resver").on("click", function () { $("#plalst :checkbox").prop("checked", function (i, val) { return !val; }); });
   $("#chkAll").on("click", function () { $("#plalst :checkbox").prop("checked", $("#chkAll").prop("checked")) });

  });
 </script>
</head>
<body>
 <div id="plalst">
  <input type="checkbox" />一队
  <input type="checkbox" />二队
  <input type="checkbox" />三队
  <input type="checkbox" />四队
  <input type="checkbox" />五队
  <input type="checkbox" />六队
 </div>
 <br /><br /><br />
 <input type="button" id="selall" value="全选" />
 <input type="button" id="selnone" value="全不选" />
 <input type="button" id="resver" value="反选" />
 <input type="checkbox" id="chkAll" /><label for="chkAll" >选择</label>
</body>
</html>

以上就是本文的全部内容,希望对大家有所帮助,同时也希望多多支持!

您可能有感兴趣的文章
JS获取鼠标点击时的位置

vue、nginx部署后刷新报404错误的解决方法

electron-builder配置项

VUE聊天页面自动滚动到底部

VUE CTRL+ENTER换行,ENTER发送消息