jQuery实现列表的全选功能_jquery-js教程-PHP中文网

jQuery实现列表的全选功能_jquery

php中文网

发布： 2016-05-16 16:08:41

原创

1709人浏览过

只需要几行代码就可以实现列表的全选功能，并且可以配合post请求执行后台的删除程序

function DelAlert(data)
    {
        if(data == 'error')
        {
            alert("错误～");
        }
        else if(data == 'success')
        {
            alert("成功～");
            location.reload();
        }
    }
    //引入jquery，这里后台配合的是thinkphp
    $(function(){
        //每行的checkbox需要有check-value属性来存放当前行的id
        //选中全部，checkAll 为选中全部的checkbox的id selctone 为每一行checkbox的class
        $('#checkAll').selectall('selectone');
        //删除选中，deleteAll为删除全部按钮的id selectone 为每一行checkbox的class 后台接收参数ids 格式如： 1,2,3
        var url = "Home/Role/delall'";
        $('#deleteAll').delselect('selectone',url,function(data){
            DelAlert(data);
        },function(){
            layer.msg("没有选中内容",2,0);
        });
    })

jquery.selectall.js

睿拓智能网站系统-网上商城

睿拓智能网站系统-网上商城1.0免费版软件大小:5M运行环境：asp+access本版本是永州睿拓信息专为电子商务入门级用户开发的网上电子商城系统，拥有产品发布，新闻发布，在线下单等全部功能，并且正式商用用户可在线提供多个模板更换，可实现一般网店交易所有功能，是中小企业和个人开展个人独立电子商务商城最佳的选择，以下为详细功能介绍：1.最新产品-提供最新产品发布管理修改，和最新产品订单查看2.推荐产

查看详情

复制代码代码如下:

(function( $ ){

    $.fn.selectall = function(className) {

        $(this).bind('click',function()

        {

            if($(this).attr('checked') == 'checked')

            {

                $(this).attr("checked",false)

                $('.'+className).attr('checked',false);

            }else{

                $(this).attr('checked','checked');

                $('.'+className).attr('checked','checked');

            }

        });

        $('.'+className).bind('click',function()

        {

            if($(this).attr('checked') == 'checked')

            {

                $(this).attr("checked",false);

            }else{

                $(this).attr('checked','checked');

            }

        });

    };

    $.fn.delselect = function(className,url,fun,unselectfun){

        $(this).bind('click',function(){

            var selectid = '';

            $("."+className).each(function(){

                if($(this).attr('checked')=='checked'){

                    selectid+=$(this).attr('check-value')+',';

                }

            });

            if(selectid)

            {

                selectid = selectid.substring(0,selectid.length-1);

                $.post(url,{ids:selectid},function(data){

                    fun(data);

                });

            }else

            {

                unselectfun();

            }

        });

    };

})( jQuery );