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 缩图函数 (onDOMLoaded)……
Oct 23 Javascript
jQuery+jqmodal弹出窗口实现代码分明
Jun 14 Javascript
jquery实现增加删除行的方法
Feb 03 Javascript
基于JQuery和CSS3实现仿Apple TV海报背景视觉差特效源码分享
Sep 21 Javascript
使用递归遍历对象获得value值的实现方法
Jun 14 Javascript
Javascript json object 与string 相互转换的简单实现
Sep 27 Javascript
详解JS去重及字符串奇数位小写转大写
Dec 29 Javascript
原生js实现焦点轮播图效果
Jan 12 Javascript
AngularJS的Filter的示例详解
Mar 07 Javascript
Vue+SpringBoot开发V部落博客管理平台
Dec 27 Javascript
React Navigation 使用中遇到的问题小结
May 08 Javascript
jQuery序列化form表单数据为JSON对象的实现方法
Sep 20 jQuery
检测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
用PHP制作静态网站的模板框架(二)
2006/10/09 PHP
php join函数应用
2011/05/04 PHP
php实现的返回数据格式化类实例
2014/09/22 PHP
php简单实现发送带附件的邮件
2015/06/10 PHP
支持汉转拼和拼音分词的PHP中文工具类ChineseUtil
2018/02/23 PHP
基于Jquery的简单&amp;简陋Tabs插件代码
2010/02/09 Javascript
理解Javascript_08_函数对象
2010/10/15 Javascript
判断多个input type=file是否有已经选择好文件的代码
2012/05/23 Javascript
采用自执行的匿名函数解决for循环使用闭包的问题
2014/09/11 Javascript
DOM节点深度克隆函数cloneNode()用法实例
2015/01/12 Javascript
D3.js实现饼状图的方法详解
2016/09/21 Javascript
详解Vue中状态管理Vuex
2017/05/11 Javascript
ReactNative列表ListView的用法
2017/08/02 Javascript
Nuxt.js踩坑总结分享
2018/01/18 Javascript
详解如何使用webpack打包JS
2018/06/21 Javascript
JS+HTML实现的圆形可点击区域示例【3种方法】
2018/08/01 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
2018/08/31 Javascript
一文了解Vue中的nextTick
2019/05/06 Javascript
javascript中可能用得到的全部的排序算法
2020/03/05 Javascript
[04:03]辉夜杯主赛事 12月25日RECAP精彩回顾
2015/12/26 DOTA
python关键字and和or用法实例
2015/05/28 Python
使用Python内置的模块与函数进行不同进制的数的转换
2016/03/12 Python
基于Tensorflow:CPU性能分析
2020/02/10 Python
Python 使用office365邮箱的示例
2020/10/29 Python
使用CSS3制作版头动画效果
2020/12/24 HTML / CSS
三个Unix的命令面试题
2015/04/12 面试题
门卫岗位安全职责
2013/12/13 职场文书
委托证明的格式
2014/01/10 职场文书
态度决定一切演讲稿
2014/05/20 职场文书
群众路线教育实践活动批评与自我批评
2014/09/15 职场文书
公司授权委托书样本
2014/09/15 职场文书
司法工作人员群众路线对照检查材料思想汇报
2014/09/30 职场文书
2015年社区教育工作总结
2015/05/13 职场文书
创业计划书之游泳馆
2019/09/16 职场文书
mysql left join快速转inner join的过程
2021/06/30 MySQL
微信告警的zabbix监控系统 监控整个NGINX集群
2022/04/18 Servers