table中checkbox选择多行

余生长醉 提交于 2020-01-13 16:06:54

原文链接:https://www.cnblogs.com/guanghe/p/9804833.html   (侵删)

页面代码:

<table id="addressTable" class="ui-jqgrid-htable ui-common-table table table-bordered">
     <thead>
         <tr>
             <td style='text-align:center;width:35px;'><input  id="selectAll" role='checkbox' type='checkbox' class='cbox checkbox' /></td>
             <td>名称</td><td>地址</td><td>联系人</td><td>电话</td><td>操作</td>
         </tr>
     </thead>
     <tbody id="tbody">
         <tr>
             <td style="text-align:center;width:35px;">
                 <input role="checkbox" type="checkbox" class="cbox checkbox">
             </td>
             <td>明十三陵</td><td>北京市市辖区昌平区天寿山麓</td><td>崇祯</td><td>18903378092</td>
             <td><a onclick="updateItem(this)">修改</a><a onclick="deleteItem(this)">删除</a></td>
         </tr>
         <tr>
            <td style="text-align:center;width:35px;">
                 <input role="checkbox" type="checkbox" class="cbox checkbox">
             </td>
             <td>1多福多寿</td><td>福建省龙岩市连城县八王坟</td><td>2</td><td>18903378092</td>
             <td><a onclick="updateItem(this)">修改</a> <a onclick="deleteItem(this)">删除</a></td>
         </tr>
     </tbody>
 </table>

js代码:

$(function() {
     $("#selectAll").change(function() {
         var checkboxs = $("#tbody").find("input[type='checkbox']");
         var isChecked = $(this).is(":checked");
         //严禁使用foreach,jq对象的遍历会使浏览器崩溃
         for(var i = 0; i < checkboxs.length; i++) {
             //临时变量,必须,否则只能选中最后一条记录
             var temp = i;
             $(checkboxs[temp]).prop("checked",isChecked);
         }
     });
 });
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!