jquery实现表格复选框---多行选择问题(php变量)

1、html多选框标签行

表头的多选框,用于全选,取消全选

<th><input id='allSelected' type="checkbox"></th>

表格中每行的第一列的checkbox

用了php,所以会有if判断和data-id的变量

<td>
     <if condition="$val.status eq 1 and $val.uid neq 0 and $val.sure_visit neq 1">
        <input name="checkbox1" class="isSelected" type="checkbox"  data-id="{#$val['id']#}">
     </if>
</td>

2、获取所有选中行的id,并把结果放入数组中

$('.visited').click(function () {
       var Check = $("table input[type=checkbox]:checked");//在table中找input下类型为checkbox属性为选中状态的数据
       var ids = new Array();
       let i = 0;
       Check.each(function () {//遍历
           var id = $(this).attr('data-id')
           ids[i] = id;
           i++;
       })
})

3、全选和取消全选

let checkAllTop = $('#allSelected');
      checkAllTop.click(function () {
      if (checkAllTop.is(':checked')) {
            console.log('全选');
            var Check = $("table input[type=checkbox]");//在table中找input
            Check.each(function () {//遍历
                 $(this).prop('checked', true);
            })
      } else {
            console.log('取消全选');
            var Check = $("table input[type=checkbox]");//在table中找input
            Check.each(function () {//遍历
                 $(this).prop('checked', false);
            })
     }
})

猜你喜欢

转载自www.cnblogs.com/mgblog/p/12095350.html
今日推荐