<d>

关于JQuery复选框的全选与全不选及相关功能操作##


w eb开发中经常碰见关于“复选框”选中和不选中的需求以及对应的相关操作,这里记录一下,方便日常使用!

父类选择

<input type="checkbox" id="checkall" title="全选">

下属子类

<input type="checkbox" name="items" value="+[ID]+" />

具体实现(全选/全不选)

$(function() { 
        $("#checkall").click(function() {
            var nn = $("#checkall").is(":checked");
            if(nn == true) {
                 var namebox = $("input[name^='items']");  //获取name值为boxs的所有input
                 for(var i = 0; i < namebox.length; i++) {
                                         namebox[i].checked=true;    //js操作选中checkbox
                 }
             }
             if(nn == false) {
                 var namebox = $("input[name^='items']");
                 for(var i = 0; i < namebox.length; i++) {
                     namebox[i].check        }
             }
        })
});

应用逻辑(功能实现)

$(function(){
        $("#deleteAll").click(function(){
            var chk_value =[]; 
            $('input[name="items"]:checked').each(function(){ //遍历复选框
                chk_value.push($(this).val()); 
            }); 
            if(chk_value.length==0){
                alert("你还没有选择任何内容!");
                return false;
            }
            //参数:var data = chk_value.toString();   唯一标识(ID)字符串("a,b,c…")
            /* 业务逻辑(异步/同步提交) */ 
        });
    });

猜你喜欢

转载自blog.csdn.net/cpongo1/article/details/80858653