• JQuery CheckBoxList


    以前我们做CheckBoxList全选,反选,一般用Aspx+CodeFile、或者用JavaScript

    现在我们可以用JQuery来帮我Easy Choose.

    这里我来写三种:

    第一种

    全选

        $(".checkBoxSelect").each(function() {
                    $(this).attr("checked", true); 
         });

    反选

         $(".checkBoxSelect").each(function() {
                            if($(this).attr("checked"))
                            {
                                    $(this).attr("checked", false);
                            }
                            else
                            {
                                    $(this).attr("checked", true);
                            }
                    });

    第二种

    全选

        $("#<%=CheckBoxList.ClientID %> input:checkbox").each(function(index,domEle){ 
                  if(this.type=="checkbox")
                       this.checked=true;
        });
    反选
        $("#<%=CheckBoxList.ClientID %> input:checkbox").each(function(index,domEle){ 
                 if(this.type=="checkbox")
                      this.checked=!this.checked;
        });
    第三种
         使用toggle方式进行全选、反选

               btnSelAll.click(function() {
                   jqClass.toggleChecks(null);
               });

               var jqClass= {
                     //Toggle Item For CheckBoxList
                     toggleChecks: function(b) {
                              $("#<%=cblContact.ClientID %> input[type=checkbox]").each(function() {
                                        if (typeof this.checked != "undefined") {
                                                  if (b == null)
                                                        this.checked = (!this.checked);
                                                  else
                                                        this.checked = b;
                                         }
                                });
                  }
           }

    第四种:Plugin 方式

    (function($$) {
        $.fn.jCheckboxList = function(opt) {
            var option = {
                root: '',  //  checkbox id of "select all"
                childCls: ''  // another checkboxs
            };
            var opt = $.extend({}, option, opt);
            var el = $(this).attr('id');
            var allchild = "#" + el + " :input[type=checkbox]." + opt.childCls;
            $("#" + opt.root).click(function() {
                var isChecked = $(this).attr('checked');
                if (isChecked)
                    $(allchild).attr('checked', true);
                else
                    $(allchild).attr('checked', false);
            });

            $.each($(allchild), function(i, v) {
                var all = $(allchild).length;
                $(v).click(function() {
                    var count = $(allchild + "[checked]").length;
                    if (count == all)
                        $("#" + opt.root).attr('checked', true);
                    else
                        $("#" + opt.root).attr('checked', false);
                });
            });
        }
    })();

  • 相关阅读:
    开博了,将会定期更新博客
    C++实验二
    C++实验三
    c++第八章课后题
    c++第八章复数运算
    我的第一篇Window Live Writer日志
    Item 3: Prefer the is or as Operators to Casts(选择is或者as操作符而不是做强制类型转换)
    C# 中list的排序
    CodeSmith的应用
    using 关键字
  • 原文地址:https://www.cnblogs.com/RuiLei/p/1555776.html
Copyright © 2020-2023  润新知