昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作，如果用submit表单提交挺方便的，但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了，因为我之前做过的项目中基本上没用Ajax来批量提交复选框数据，今天用到了就分享一下。
由于我做的项目一些地方比较复杂，这里我只举一个小例子，能理解就好。
首先，我做了一个简单的多个复选框的界面，如图：
这是一个比较简单的多个复选框提交界面。代码如下：
<body>
<div>
<input type="checkbox" name="check" value="1"/>复选框1
<input type="checkbox" name="check" value="2"/>复选框2
<input type="checkbox" name="check" value="3"/>复选框3
<br/>
<input type="checkbox" name="check" value="4"/>复选框4
<input type="checkbox" name="check" value="5"/>复选框5
<input type="checkbox" name="check" value="6"/>复选框6
<br/>
<input type="checkbox" name="check" value="7"/>复选框7
<input type="checkbox" name="check" value="8"/>复选框8
<input type="checkbox" name="check" value="9"/>复选框9
<input type="button" id="dosubmit" value="提交">
</div>
</body>
然后就开始写jQuery程序了。代码如下：
<script>
$('#dosubmit').click(function(){
var checkID = [];//定义一个空数组 $("input[name='check']:checked").each(function(i){//把所有被选中的复选框的值存入数组
checkID[i] =$(this).val();
}); //用Ajax传递参数
$.post('Ajax.php',{checkID:checkID},function(json){ },'json')
})
</script>
注意：写jQuery之前一定要引入JQ库文件，不然怎么搞都没用，可别大意了，我有时候就是这样.......
好了，准备工作都做好了，开始测试：
我先选中了几个框框：
点击“提交”按钮后，打开F12调试，结果如图所示：
OK，现在已经实现了使用jQuery结合Ajax批量操作复选框提交数据了。这里只是简单的示范一下jQuery结合Ajax的用法，界面和代码就简单点好了。
本文属原创内容，为了尊重他人劳动，转载请注明本文地址：
http://www.cnblogs.com/luokakale/p/7281628.html
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的更多相关文章
-
JQuery Mobile - 修改复选框的选中状态无效解决办法！
今晚,在编写JQuery Mobile程序时候,需要在代码里面控制复选框的选中状态,很简单的代码啊,很快完成了!等测试程序时候傻眼了,页面无论如何也不按照我写的代码显示出来!问题出在哪里呢?是我写的控 ...
-
Jq复选框选择（取复选框被选中的值）
<input type="button" id="btn5" value="获得选中的所有值"> <input typ ...
-
【jQuery】复选框的全选、反选，推断哪些复选框被选中
本文与<[JavaScript]复选框的全选.反选.推断哪些复选框被选中>(点击打开链接)为姊妹篇,把里面内容再与jQuery框架中实现一次,相同做到例如以下的效果: 布局还是相同的布局, ...
-
jQuery实现checkbox（复选框）选中、全选反选代码
谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...
-
jquery特效（6）—判断复选框是否选中进行答题提示
前面有一段时间思想开了小差,跟着师父学习了一段时间才发现差距很大,看来我要奋起直追~\(≧▽≦)/~啦啦啦. 最近公司在做一个项目,需要根据用户选择的选项给出相应的提示,下面来看我写的测试程序的效果: ...
-
jQuery获取单选框（复选框）选中的状态
jQuery 获取单选框(复选框)选中的状态 <input type="checkbox" name="" id="choose"/& ...
-
jquery完成带复选框的表格行高亮显示
jquery完成带复选框的表格行高亮显示 通过jquery技术来操作表格是件简单的事,通过jquery的语法,可以很轻松的完成表格的隔行换色,悬浮高亮,在实际的应用中可能会出现表格中带复选框的,删除时 ...
-
复选框checked 选中后不显示打钩
复选框checked 选中后不显示打钩 checkbox属性checked="checked"已有,但复选框却不显示打钩的原因 复选框绑定了click事件,点一次选中,再点击取 ...
-
案例1.通过Jquery来处理复选框
实现以下功能: 1:选中第一个复选框,那么下面所有的复选框都选中,去除选中第一个复选框,下面的都不选中 2:当点击全选按钮,上面足球.篮球.游泳.唱歌 全部选中 3:当点击全不选按钮,上面四个全部取消 ...
随机推荐
-
android ListView 九大重要属性详细分析、
android ListView 九大重要属性详细分析. 1.android ListView 一些重要属性详解,兄弟朋友可以参考一下. 首先是stackFromBottom属性,这只该属性之后你做好 ...
-
【C-顺序程序结构】
一.C语句 可分为以下五类: ① 表达式语句 表达式: ②.函数调用语句 函数名(实际参数表); ③.控制语句 条件判断语句:if语句.switch语句: 循环执行语句:do while语句.whil ...
-
Android 4.4沉浸式状态栏的实现
要实现Android 4.4上面的沉浸式状态栏要用到开源项目SystemBarTint(https://github.com/hexiaochun/SystemBarTint) public clas ...
-
解决python 提示 SyntaxError: Missing parentheses in call to &#39;print&#39;
刚刚学习python,练习他的输出,发现输出一个常量时报错了,如下: 发现是因为python2.X版本与python3.X版本输出方式不同造成的在python3.X的,输入内容时都要带上括号pytho ...
-
配置Struts2的异常处理
最好的方式是通过声明管理异常处理 1Action里面的execute()方法抛出所有异常:public String execute() throws Exception{} 2声明异常捕捉 ...
-
分享一个解析XML成为php数组的方法
原文:分享一个解析XML成为php数组的方法 <?php /* * To change this template, choose Tools | Templates * and open th ...
-
【转】topcoder插件配置（傻瓜教程-图文版）
地址:http://whucc2009luochen.blog.163.com/blog/static/1305715602010827102342860/ 1.插件下载地址:http://www.t ...
-
日志挖掘(logminer)
转. 如何使用logminer分析Oracle 联机日志 笔者在工作中经常遇到这样的情况:为了追踪数据的变化,需要知道某个表或者表中的某行数据是什么时候被修改的,以及修改前的内容. ...
-
width:100%和width:auto区别
在div父元素是body时 1.先看没有width限制的div <div style="border:1px solid red; margin-left:50px; margin-r ...
-
pandas_datareader.data 和 fix_yahoo_finance 获取金融数据
参考:https://zhuanlan.zhihu.com/p/35360694 1.获取数据 #定义所需要的数据 gafataDict={"谷歌":"GOOG" ...