JQuery对checkbox操作 (循环获取)


Posted in Javascript onMay 20, 2011
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DemoCheckBox.aspx.cs" Inherits="DemoCheckBox" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>无标题页</title> 
<script src="js/jquery-1.6.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
jQuery(function($){ 
//全选 
$("#btn1").click(function(){ 
$("input[name='checkbox']").attr("checked","true"); 
}) 
//取消全选 
$("#btn2").click(function(){ 
$("input[name='checkbox']").removeAttr("checked"); 
}) 
//选中所有基数 
$("#btn3").click(function(){ 
$("input[name='checkbox']:even").attr("checked","true"); 
}) 
//选中所有偶数 
$("#btn6").click(function(){ 
$("input[name='checkbox']:odd").attr("checked","true"); 
}) 
//反选 
$("#btn4").click(function(){ 
$("input[name='checkbox']").each(function(){ 
if($(this).attr("checked")) 
{ 
$(this).removeAttr("checked"); 
} 
else 
{ 
$(this).attr("checked","true"); 
} 
}) 
}) 
//或许选择项的值 
var aa=""; 
$("#btn5").click(function(){ 
$("input[name='checkbox']:checkbox:checked").each(function(){ 
aa+=$(this).val() 
}) 
document.write(aa); 
}) 
}) 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="button" id="btn1" value="全选"> 
<input type="button" id="btn2" value="取消全选"> 
<input type="button" id="btn3" value="选中所有奇数"> 
<input type="button" id="btn6" value="选中所有偶数"> 
<input type="button" id="btn4" value="反选"> 
<input type="button" id="btn5" value="获得选中的所有值"> 
<br> 
<input type="checkbox" name="checkbox" value="checkbox1"> 
checkbox1 
<input type="checkbox" name="checkbox" value="checkbox2"> 
checkbox2 
<input type="checkbox" name="checkbox" value="checkbox3"> 
checkbox3 
<input type="checkbox" name="checkbox" value="checkbox4"> 
checkbox4 
<input type="checkbox" name="checkbox" value="checkbox5"> 
checkbox5 
<input type="checkbox" name="checkbox" value="checkbox6"> 
checkbox6 
<input type="checkbox" name="checkbox" value="checkbox7"> 
checkbox7 
<input type="checkbox" name="checkbox" value="checkbox8"> 
checkbox8 
</div> 
</form> 
</body> 
</html>

jquery 循环读取checkbox值
$("input[type=checkbox][checked]").each(function(){ //由于复选框一般选中的是多个,所以可以循环输出 
alert($(this).val()); 
});
Javascript 相关文章推荐
javascript 出生日期和身份证判断大全
Nov 13 Javascript
斜45度寻路实现函数
Aug 20 Javascript
javascript 不间断的图片滚动并可点击
Jan 15 Javascript
jquery中实现简单的tabs插件功能的代码
Mar 02 Javascript
window.onresize 多次触发的解决方法
Nov 08 Javascript
javascript学习笔记之10个原生技巧
May 21 Javascript
JQuery实现文字无缝滚动效果示例代码(Marquee插件)
Mar 07 Javascript
React如何避免重渲染
Apr 10 Javascript
javascript原型链学习记录之继承实现方式分析
May 01 Javascript
JS+canvas五子棋人机对战实现步骤详解
Jun 04 Javascript
Vue自动构建发布脚本的方法示例
Jul 24 Javascript
深入浅析React中diff算法
May 19 Javascript
检测jQuery.js是否已加载的判断代码
May 20 #Javascript
JQuery datepicker 使用方法
May 20 #Javascript
Jquery中Ajax 缓存带来的影响的解决方法
May 19 #Javascript
jQuery对表单元素的取值和赋值操作代码
May 19 #Javascript
基于jquery的button默认enter事件(回车事件)。
May 18 #Javascript
jquery构造器的实现代码小结
May 16 #Javascript
让innerText在firefox火狐和IE浏览器都能用的写法
May 14 #Javascript
You might like
ob_start(),ob_start('ob_gzhandler')使用
2006/12/25 PHP
discuz图片顺序混乱解决方案
2015/07/29 PHP
PHP根据session与cookie用户登录状态操作类的代码
2016/05/13 PHP
PHP中Laravel 关联查询返回错误id的解决方法
2017/04/01 PHP
ThinkPHP实现附件上传功能
2017/04/27 PHP
PHP结合Redis+MySQL实现冷热数据交换应用案例详解
2019/07/09 PHP
PHP读取XML文件的方法实例总结【DOMDocument及simplexml方法】
2019/09/10 PHP
PHP实现通过二维数组键值获取一维键名操作示例
2019/10/11 PHP
Laravel实现搜索的时候分页并携带参数
2019/10/15 PHP
jquery属性选择器not has怎么写 行悬停高亮显示
2013/11/13 Javascript
Javascript数组操作函数总结
2015/02/05 Javascript
js图片翻书效果代码分享
2015/08/20 Javascript
js实现五星评价功能
2017/03/08 Javascript
Vue通过input筛选数据
2020/10/26 Javascript
bootstrap paginator分页插件的两种使用方式实例详解
2017/11/14 Javascript
Vue CLI3 开启gzip压缩文件的方式
2018/09/30 Javascript
JS拖拽排序插件Sortable.js用法实例分析
2019/02/20 Javascript
解析JS在获取当前月的最后一天遇到的坑
2019/08/30 Javascript
VueJS实现用户管理系统
2020/05/29 Javascript
原生js+canvas实现贪吃蛇效果
2020/08/02 Javascript
Python实现PS滤镜Fish lens图像扭曲效果示例
2018/01/29 Python
编写多线程Python服务器 最适合基础
2018/09/14 Python
详解通过API管理或定制开发ECS实例
2018/09/30 Python
Django自定义模板过滤器和标签的实现方法
2019/08/21 Python
PIL包中Image模块的convert()函数的具体使用
2020/02/26 Python
中学生社会实践活动总结
2014/07/03 职场文书
银行党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
公司开会通知
2015/04/20 职场文书
反邪教警示教育活动总结
2015/05/09 职场文书
高中军训感想
2015/08/07 职场文书
2016年度师德标兵先进事迹材料
2016/02/26 职场文书
管理者们如何制定2019年的工作计划?
2019/07/01 职场文书
python opencv人脸识别考勤系统的完整源码
2021/04/26 Python
Redis延迟队列和分布式延迟队列的简答实现
2021/05/13 Redis
Python实现归一化算法详情
2022/03/18 Python
Win11局域网共享权限在哪里设置? Win11高级共享的设置技巧
2022/04/05 数码科技