Js实现批量操作、（批量删除）

在开发过程中批量操作是常有，其原理简单、你只要复制下面的代码就能实现你的功能：

 

<button type="button" class=""  οnclick="del_amin()">批量删除</button>
<table class="table">
   <thead>
      <tr>
         <th><input type="checkbox" id="all" value=""></th>
         <th>第一列</th>
         <th>第二列</th>
          <th>第三列</th>
          <th></th>

      </tr>
   </thead>
   <tbody>

      <tr>
          <td><input type="checkbox" value="" name="id"></td>
          <td>1</td>
          <td>2</td>
          <td>3</td>

      </tr>
         <tr>
          <td><input type="checkbox" value="" name="id"></td>
          <td>1</td>
          <td>2</td>
          <td>3</td>

      </tr>
         <tr>
          <td><input type="checkbox" value="" name="id"></td>
          <td>1</td>
          <td>2</td>
          <td>3</td>

      </tr>
   </tbody>
</table>

</body>
<script>
var all_list=document.getElementById("all");//获取批量操作 标签
var id_list=document.getElementsByName("id");//获取勾选的标签
all_list.οnclick=function(){//勾选全选时
    for(var i=0;i<id_list.length;i++){
        //所有的选择框和全选一致
        id_list[i].checked=all_list.checked;
    }
};
//点击复选框
for(var i=0;i<id_list.length;i++){
    id_list[i].οnclick=function(){
        //判断是否全部选中,遍历集合
        for(var j=0;j<id_list.length;j++){
          if(id_list[j].checked==false){
            all_list.checked=false;
            break;
          }else{
            all_list.checked=true;
          }
        }
    };
}
/*封面图-批量删除*/
function del_amin(){
        var ids_list="";
        var n=0;
        //拼接出一个名为ids_list的数组ids_list=1&ids_list=2&ids_list=3&ids_list=4……
        for(var i=0;i<id_list.length;i++){
            if(id_list[i].checked==true){//选中为true
                var id=id_list[i].value;
                if(n==0){
                    ids_list+="ids_list="+id;
                }else{
                    ids_list+="&ids_list="+id;
                }
                n++;
            }
        }

    var r=confirm("是否确认删除？");
    if(r==true){
        //确认删除

        var masige = { all_id :ids_list };
        //Ajax 向后台提交数据
         $.ajax({
                    type: "POST",
                    url:'你的url',
                    data:masige,
                    async: false,
                    error: function(request) {
                       
                    },
                    success: function(data) {
                        console.log(data);
                        alert("删除成功");
                         //刷新当前页面
                        window.location.reload();
                  });

        return true;
    }
      else{
        //不删除
        return false;
    }
    
}

</sc>

样式虽丑、但功可用、渴望留言交流，你的问题。