jquery 全选、全不选、反选效果的实现代码【推荐】

jquery 全选、全不选、反选效果的实现代码【推荐】 

首先:引入jquery

haran.info_jquery实例_全选全不选反选_select-all_unselect-all_reverse


 

样式:




 

body布局:


   
haran.info_脚本编程
haran.info_网站编程
haran.info_系统管理
haran.info_服务器配置
haran.info_系统运维
haran.info_博客
haran.info_首页
 

实现功能:


$(document).ready(function () {
      
  $("#selAll").click(function () { //":checked"匹配所有的复选
    $("#div1 :checkbox").attr("checked", true); //"#div1 :checked"之间必须有空格checked是设置选中状态。如果为true则是选中fo否则false为不选中
  });
      
  $("#unselAll").click(function () { 
    $("#div1 :checkbox").attr("checked", false); 
  });
      
  //理解用迭代原理each(function(){})
  $("#reverse").click(function () { 
  $("#div1 :checkbox").each(function () {
  $(this).attr("checked",!$(this).attr("checked")); //!$(this).attr("checked")判断复选框的状态:如果选中则取反
    }); 
  });
}); 

以上这篇jquery 全选、全不选、反选效果的实现代码【推荐】就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

你可能感兴趣的:(jquery 全选、全不选、反选效果的实现代码【推荐】)