首页 > 代码库 > table中列复选框全选,再选 效果
table中列复选框全选,再选 效果
<table class="table table-striped sortable table-bordered table-hover " id="zdnews"> <thead> <tr> <th>运单号</th> <th>发货人</th> <th>收货人</th> <th>货物信息</th> <th id="payxf"><input type="checkbox" class="zdcheckbox">现付</th> <th id="payxf1"><input type="checkbox" class="zdcheckbox">到付</th> <th id="payxf2"><input type="checkbox" class="zdcheckbox">月结</th> <th id="payxf3"><input type="checkbox" class="zdcheckbox">回执付</th> <th id="payxf4"><input type="checkbox" class="zdcheckbox">返厂付</th> <th >汇总费用</th> </tr> </thead> <tbody> <tr> <td> <a href="ddlook.html">100adggg3253445345454</a> <br></td> <td>俞亮 <br>山西省临汾市</td> <td>匿名 <br>黑龙江省佳木斯市桦南县</td> <td>龙岩,435件,127千克,32方</td> <td><input type="checkbox" class="zdcheckbox">100</td> <td><input type="checkbox" class="zdcheckbox">50</td> <td><input type="checkbox" class="zdcheckbox">10</td> <td><input type="checkbox" class="zdcheckbox">20</td> <td><input type="checkbox" class="zdcheckbox">30</td> <td><span class="colorred ">0</span></td> </tr> <tr> <td> <a href="ddlook.html">20adggg3253445345454</a> <br></td> <td>俞亮 <br>山西省临汾市侯马市</td> <td>匿名 <br>黑龙江省佳木斯市桦南县</td> <td>龙岩,435件,127千克,32方</td> <td><input type="checkbox" class="zdcheckbox">20</td> <td><input type="checkbox" class="zdcheckbox">30</td> <td><input type="checkbox" class="zdcheckbox">40</td> <td><input type="checkbox" class="zdcheckbox">50</td> <td><input type="checkbox" class="zdcheckbox">60</td> <td><span class="colorred ">0</span></td> </tr> <tr> <td> <a href="ddlook.html">40adggg3253445345454</a> <br></td> <td>俞亮 <br>山西省临汾市侯马市</td> <td>匿名 <br>黑龙江省佳木斯市桦南县</td> <td>龙岩,435件,127千克,32方</td> <td><input type="checkbox" class="zdcheckbox">40</td> <td><input type="checkbox" class="zdcheckbox">10</td> <td><lable><input type="checkbox" class="zdcheckbox">20</td> <td><input type="checkbox" class="zdcheckbox">30</td> <td><input type="checkbox" class="zdcheckbox">50</td> <td><span class="colorred ">0</span></td> </tr> </tbody> </table>
<script> //现付 $("#payxf").bind("click",function () { if ($(this).hasClass("checkth")) { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(4).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘th‘).eq(4).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘td‘).eq(4).removeClass("checkth"); $(this).find(‘th‘).eq(4).removeClass("checkth"); }) } else { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(4).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘th‘).eq(4).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘td‘).eq(4).addClass(‘checkth‘); $(this).find(‘th‘).eq(4).addClass(‘checkth‘); }) } }); //到付 $("#payxf1").bind("click",function () { if ($(this).hasClass("checkth")) { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(5).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘th‘).eq(5).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘td‘).eq(5).removeClass("checkth"); $(this).find(‘th‘).eq(5).removeClass("checkth"); }) } else { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(5).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘th‘).eq(5).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘td‘).eq(5).addClass(‘checkth‘); $(this).find(‘th‘).eq(5).addClass(‘checkth‘); }) } }); //月结 $("#payxf2").bind("click",function () { if ($(this).hasClass("checkth")) { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(6).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘th‘).eq(6).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘td‘).eq(6).removeClass("checkth"); $(this).find(‘th‘).eq(6).removeClass("checkth"); }) } else { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(6).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘th‘).eq(6).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘td‘).eq(6).addClass(‘checkth‘); $(this).find(‘th‘).eq(6).addClass(‘checkth‘); }) } }); //回执付 $("#payxf3").bind("click",function () { if ($(this).hasClass("checkth")) { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(7).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘th‘).eq(7).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘td‘).eq(7).removeClass("checkth"); $(this).find(‘th‘).eq(7).removeClass("checkth"); }) } else { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(7).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘th‘).eq(7).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘td‘).eq(7).addClass(‘checkth‘); $(this).find(‘th‘).eq(7).addClass(‘checkth‘); }) } }); //返厂付 $("#payxf4").bind("click",function () { if ($(this).hasClass("checkth")) { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(8).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘th‘).eq(8).find(‘:checkbox‘).attr(‘checked‘,false); $(this).find(‘td‘).eq(8).removeClass("checkth"); $(this).find(‘th‘).eq(8).removeClass("checkth"); }) } else { $("#zdnews tr").each(function(){ $(this).find(‘td‘).eq(8).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘th‘).eq(8).find(‘:checkbox‘).attr(‘checked‘,true); $(this).find(‘td‘).eq(8).addClass(‘checkth‘); $(this).find(‘th‘).eq(8).addClass(‘checkth‘); }) } }); // 单个选择 $("#zdnews tbody tr").each(function(){ $(this).find(‘td‘).bind("click",function () { if ($(this).hasClass("checkth")) { $(this).find(‘:checkbox‘).attr(‘checked‘,false); $(this).removeClass("checkth"); } else { $(this).find(‘:checkbox‘).attr(‘checked‘,true); $(this).addClass(‘checkth‘); } }); // }) </script>
table中列复选框全选,再选 效果
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。