jquery的全选插件

全选看起来挺简单的，要做得完美就不那么容易了。

目前，我的全选插件能做到以下6点：

1.点击全选checkbox，能将要选择的checkbox都选中。去掉全选按钮，能将所有的checkbox都不选。这是最基本的功能，凡网上所有的有关全选的脚本都能满足这个要求。

2.点击选择的checkbox们，能根据是不是已经全部选择了，自动勾选或者取消勾选“全选checkbox”。

3.如果另外还有"全选按钮"，点击的时候也要能全选。

4.如果还有“全不选按钮”，点击的时候要能全不选。

5.全选与不选的状态切换中，要能自定义事件，与全选与不选的状态相呼应。

6.若存在checkbox组，组1、组2要控制组内的全选问题，还要另外有全选按钮能控制对组1、组2的全选。然后可以无限向下嵌套。

 (function ($) {
     $.fn.nCheckAll = function (settings) {
         var defaultSetting = { filter: null, checkButton: false, notCheckButton: false, toggleFun: false };
         var self = $(this);
         $.extend(defaultSetting, settings);
         var selectStr = defaultSetting.filter;
         var flagToggle = true;

         self.each(function () {
             this.checkAll = function (checked) {
                 checkAll(checked);
             }
         });

         $(defaultSetting.filter).each(function () {
             this.check = function () {
                 setAllCheckBoxState($(this).attr("checked") && isAllChecked(selectStr));
             }
         });

         function checkSub(checked) {
             $(defaultSetting.filter).each(function () {
                 if (this.checkAll) this.checkAll(checked);
             });
         }

         function checkSup(checked) {
             self.each(function () {
                 if (this.check) this.check();
             });
         }

         function isAllChecked(selectStr) {
             var res = true;
             $(selectStr).each(function () {
                 if (!$(this).attr("checked")) {
                     res = false;
                     return false;
                 }
             });
             return res;
         }

         function doToggle(flag) {
             if (defaultSetting.toggleFun) { defaultSetting.toggleFun(flag); flagToggle = !flag; }
         }

         function setAllCheckBoxState(checked) {
             doToggle(checked);
             setChecked(self, checked);
             checkSup(checked);
         }

         function setChecked(item, checked) {
             if (checked) item.attr("checked", true);
             else item.removeAttr("checked");
         }

         function setEventForchkAll(selectStr) {
             self.bind("click", function () {
                 this.checkAll($(this).attr("checked"));
             });

             $(selectStr).bind("click", function () {
                 this.check();
             });

             setAllCheckBoxState(isAllChecked(selectStr));
         }

         function checkAll(checked) {
             setChecked($(selectStr), checked);
             setAllCheckBoxState(checked);
             checkSub(checked);
         }

         setEventForchkAll(selectStr);

         if (defaultSetting.checkButton) $(defaultSetting.checkButton).bind("click", function () {
             checkAll(flagToggle);
         });

         if (defaultSetting.notCheckButton) $(defaultSetting.notCheckButton).bind("click", function () {
             checkAll(false);
         });
     }
 })(jQuery);

源代码

使用举例：

function toogleBtn(checked) {
   if (checked) $("#btnCheckAll").val("全不选(A)");
   else $("#btnCheckAll").val("全选(A)");
  }
  $(function () {
   $(".chkAll input[type='checkbox']").nCheckAll({ filter: ".chkSelected input[type='checkbox']"
   , checkButton: "#btnCheckAll"
   , toggleFun: toogleBtn
   });
  });