简单使用JQ代码实现全选反选全不选批删

来源：互联网发布：html个人简历模板源码编辑：程序博客网时间：2024/06/18 00:05

<html>
<table class="table">    <tr>        <td>选择</td>        <td>ID</td>        <td>NAME</td>        <td>SEX</td>        <td>AGE</td>        <td>TEL</td>        <td>操作</td>        <td>查看</td>    </tr>    <tbody class="tbo1">    <?php foreach($data as $key=>$val):?>    <tr>        <td><input type="checkbox" value="<?=$val['s_id']?>" class="c_box"></td>        <td><?=$val['s_id']?></td>        <td><?=$val['s_name']?></td>        <td><?=$val['s_sex']?></td>        <td><?=$val['s_age']?></td>        <td><?=$val['s_tel']?></td>        <td><a href="">操作</a></td>        <td><a href="?r=students/select&s_id=<?=$val['s_id']?>">查看</a></td>    </tr>    <?php endforeach;?>    </tbody></table><button class="all">全选</button><button class="nall">反选</button><button class="no_all">取消</button><button class="delete">删除</button>
</html>
JQ代码``````````````````````````````````````````````
//反选$(document).delegate('.doAll','click',function () {    $('.cbox').each(function () {        $(this).prop('checked',!$(this).prop('checked'));    })})
//全选
$(document).delegate('.onAll','click',function () {    $('.cbox').each(function () {        $(this).prop('checked',true);    })
})
//全不选$(document).delegate('.noAll','click',function () {    $('.cbox').each(function () {        $(this).prop('checked',false);    })})//批删$(document).delegate('.delAll','click',function () {    $('.cbox').each(function () {        if ($(this).prop('checked')){            _ids = $(this).val();            del(_ids,$(this))        }    })})function del(ids,obj) {    $.post('?r=students/getdel',{ids:ids},function (success) {        if (success == 1){            obj.parents('tr').remove();        }else {            alert('删除失败')        }    })
}
//单删$('.oneDel').click(function () {        _id = $(this).attr('id')        del(_id,$(this))})

0 0

简单使用JQ代码 实现全选 反选 全不选 批删

简单使用JQ代码实现全选反选全不选批删