[Ajax] 如何使用Ajax传递多个复选框的值

HTML+JavaScript代码：

 1 <!DOCTYPE html>
 2 <html>
 3
 4     <head>
 5         <meta charset="UTF-8">
 6         <title>选择复选框</title>
 7
 8         <!--导入jQuery包-->
 9         <script type="text/javascript" src="js/jquery-1.6.js" ></script>
10     </head>
11
12     <body>
13         <!--
14             保持同样的name属性，
15             value属性仍然可以使用 <%#Eval("id")%>
16             这里直接写上作为例子
17         -->
18         <input type="checkbox" name="checkbox1" runat="server" value="1001" />1001<br />
19         <input type="checkbox" name="checkbox1" runat="server" value="1002" />1002<br />
20         <input type="checkbox" name="checkbox1" runat="server" value="1003" />1003<br />
21         <input type="checkbox" name="checkbox1" runat="server" value="1004" />1004<br />
22
23         <!--删除按钮，显示选择的复选框的value属性值-->
24         <button id="btndelete">删除</button>
25
26         <br />
27             后台使用ASP:
28
29             <pre>
30             //获取String类型的，用逗号分隔
31             String str=Page.Request["deleteId"];
32
33             //截取为数组
34             String[] delIds=str.split(',');
35
36             //转换为int,数组长度一致
37             int[] newDelIds=new int[delIds.length];
38
39             for(int i=0;i<delIds.length;i++){
40                 //执行强转
41                 newDelIds[i]=Integer.parseInt(delIds[i]);
42             }
43             </pre>
44
45
46     </body>
47     <script>
48         //所有的复选框控件，通过名字属性获取
49         var checkboxObjs = document.getElementsByName("checkbox1");
50
51
52         //删除按钮绑定事件
53         $("#btndelete").click(function() {
54             //定义存储value的数组,初始为空
55             var delVals = [];
56
57             //找出选中复选框的值
58             for(var i = 0; i < checkboxObjs.length; i++) {
59                 var checkboxObj = checkboxObjs[i]; //遍历的复选框元素
60                 //判断是否有选中
61                 if(checkboxObj.checked) {
62                     //选中的value值添加到数组中
63                     delVals.push(checkboxObj.value);
64                 }
65             }
66             //for循环结束，先打印获取的value是否正确。
67 //            alert(delVals);
68
69             //判空
70             if(delVals.length<=0){
71                 alert("请选择");
72             }else{
73                 //执行Ajax提交
74                 $.ajax({
75                     url:"",
76                     type:"POST",
77                     traditional: true,//阻止深度序列化,必写
78                     data:{
79                         //删除的value数组
80                         "deleteId":delVals
81                     },
82                     success:function(data){
83                         //回调函数
84                     }
85                 });
86             }
87         });
88     </script>
89
90
91 </html>

转载于:https://www.cnblogs.com/x-you/p/8562613.html

[Ajax] 如何使用Ajax传递多个复选框的值相关推荐

表单绑定复选框的值和图片上传
表单如何实现与复选框的值绑定一致 <u-form-item :label-position="labelPosition" label="提供服务" pr ...
html表单的复选框的值,关于表单：HTML复选框的checked属性的正确值是什么？
我们都知道如何在HTML中形成一个复选框输入: 我不知道 - 复选复选框的技术正确值是什么? 我看到这些都有效: 答案是无关紧要的吗? 我没有看到证据证明答案在规范中标记为正确: Checkboxes ...
Django获取多个复选框的值，并插入对应表底下
1.实现的功能类似于,多个复选框,后面还有一个备注,之后要把复选框的值和备注一一对应插入数据库表中,主要提供一个思路,代码不全. 2.首先,html页面先设计好,多个复选框还有一个个备注,代码如下: ...
JQ对复选框全选、获取复选框的值、回选
1.全选.全不选: function checkAllFun(a){if (a.checked){$("input[name='checkbox']:checkbox").each ...
支付宝小程序获取复选框选中值id，使其显示且可编辑
问题概述在做支付宝小程序编辑表单时,需要将用户之前填.选的信息显示出来后再编辑.这里针对复选框选中值的获取显示,通过服务端发送请求后拿到的选中id,显示选中值并且可编辑. axml代码片段 < ...
android view 存值,在android studio中保存textview和复选框的值
问:如何在android studio中保存文本视图和复选框的值,以便稍后我进入该活动时以及在设置新值然后保持新值时可见设置的数据. 答:SharedPreferences用于在Android中存储原 ...
layui获取复选框的值
layui获取复选框的值 //HTML代码 <form class="layui-form"> <div class="layui-form-i ...
layui复选框怎么取值_layui如何获取checkbox复选框的值
layui如何获取checkbox复选框的值发布时间:2020-10-21 17:07:09 来源:亿速云阅读:164 作者:Leah 本篇文章给大家分享的是有关layui如何获取checkbox ...
用jQuery如何获取复选框的值
获取复选框的值 <div><input type="checkbox" name="" id="suibian">& ...

[Ajax] 如何使用Ajax传递多个复选框的值

[Ajax] 如何使用Ajax传递多个复选框的值相关推荐

最新文章

热门文章