• jquery实现checkbox全选,选择性勾选,以及table中点击tr中任意一行实现选中或不选中


    //html页面
    <table class="ui-zx-table" id="tb1" style=" 100%"> <thead> <tr> <th width="60"><label> <input name="select_all" id="select_all" type="checkbox" /> </label></th> <th width="60">任务ID</th> <th width="65">上报人手机号</th> <th width="40">省份</th> <th width="70">提交人工审核时间</th> <th width="180">短信内容</th> <th width="70">被上报号码</th> <th width="55">处理人</th> <th width="55">审核状态</th> <th width="55">操作</th> </tr> </thead> <tbody class="ms-controller" ms-controller="vmCheckPendingQuery" style="color: black;table-layout:fixed;"> <tr ms-if="json.length>0" ms-repeat="json"> <td><input type="checkbox" name="select_item" id="select_item" ms-attr-value="el.tbid" ></td> <td>{{el.tbid}}</td> <td>{{el.uploadBillid}}</td> <td>{{el.province}}</td> <td>{{el.createTime|date("yyyy-MM-dd")}}</td> <td style="word-break:break-all;">{{el.smsContent}}</td> <td>{{el.sourcePort}}</td> <td>{{el.staff}}</td> <td>{{el.state==1?'已审核':'待审核'}}</td> <td width="110"> <a href="javascript:;" ms-on-click="edit(el)">处理</a> </td> </tr> <tr ms-if="json.length < 1"> <td colspan="11">没有数据</td> </tr> </tbody> </table>
    //全选,全不选
    var checkboxes = document.getElementsByName('select_item');
                  $("#select_all").click(function() {
                      for (var i = 0; i < checkboxes.length; i++) {
                          var checkbox = checkboxes[i];
                          if (!$(this).get(0).checked) {
                              checkbox.checked = false;
                          } else {
                              checkbox.checked = true;
                          }
                      }
                  });
           //单个选中
                $('#tb1 tbody').on('click', "input", function() {
                var rowObj=dataExample.row($(this).closest("tr"));
                    var checkbox = document.getElementById(rowObj.data().tbid);
                    if(checkbox.checked==true){
                        checkbox.checked=false
                    }else{
                        checkbox.checked=true 
                    }
                });
                //点击一列tr里除最后一个td之外点击任意位置选中或不选中
                $('#tb1 tbody').on('click', "td:not(:last-child)", function() {
                    var rowObj=dataExample.row($(this).closest("tr"));
                     var checkbox = document.getElementById(rowObj.data().tbid);
                     if(checkbox.checked==true){
                         checkbox.checked=false
                     }else{
                         checkbox.checked=true 
                     }
                });
  • 相关阅读:
    20201107
    20201024
    20201020
    20200331
    20200330
    20200320
    20200319
    20200310
    20200221
    20190926
  • 原文地址:https://www.cnblogs.com/sm-myworks/p/6144407.html
Copyright © 2020-2023  润新知