页面显示
页面代码
1 <div>
2 <div><input type="checkbox" value="" class="check_all" >全选</div>
3 <div><input type="checkbox" class="check_Id" value="10,12,46">11</div>
4 <div><input type="checkbox" class="check_Id" value="132">22</div>
5 <div><input type="checkbox" class="check_Id" value="1">33</div>
6 <div><input type="checkbox" class="check_Id" value="21,6">44</div>
7 <button id="batch_btn">批量操作</button>
8 </div>
脚本代码
1 $(function () {
2 //全选 控制单个
3 $("body").on("change", ".check_all", function () {
4 var ischecked = $(this).prop("checked");
5 $('.check_Id').prop("checked", ischecked);
6 });
7 //单个影响全选
8 $("body").on("change", ".check_Id", function () {
9 var chsub = $(".check_Id").length;
10 var checkedsub = $(".check_Id:checked").length;
11 if (checkedsub === chsub) {
12 $(".check_all").prop("checked", true);
13 } else {
14 $(".check_all").prop("checked", false);
15 }
16 });
17 //批量 提交全部数据
18 $("body").on("click", "#batch_btn", function () {
19 var checkedsub = $(".check_Id:checked");
20 if (checkedsub.length === 0) {
21 alert("您还没有选中值");
22 return;
23 }
24 var all_info = new Array();
25 checkedsub.each(function () {
26 console.log($(this).val());
27 var all_ids = $(this).val().split(",");
28 for (var i = 0; i < all_ids.length; i++) {
29 all_info.push({ "Id": all_ids[i]});
30 }
31 });
32 console.log(all_info);
33 $.ajax({
34 type: "POST",
35 url: "/test/test",
36 contentType: "application/json", //必须有
37 dataType: "json", //表示返回值类型，不必须
38 data: JSON.stringify({ batches: all_info}),
39 success: function (jsonResult) {
40 console.log(jsonResult);
41 }
42 });
43 });
44 });
