脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-jQuery实现列表的全选功能，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。

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

js

 

代码如下:

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

 

代码如下:

(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 );

以上所述就是本文的全部内容了，希望大家能够喜欢。

觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-jQuery实现列表的全选功能全部内容，希望文章能够帮你解决javascript代码实例教程-jQuery实现列表的全选功能所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。