jQuery中RadioButtonList的功能及用法实例介绍


Posted in Javascript onAugust 23, 2013

代码分析

$("#<%= ibSubmit.ClientID%>").click(function() { 
var flag = true; 
//alert($("table[id^=ctl]").length); 
//创建一个checked的arr数组,用于存储每个radiobutton的checked情况 
var arr = new Array; 
$("table[id^=ctl] input[type=radio]").each(function(i) { 
arr.push(this.checked); 
}); //然后再创建一个arrTrue数组,用于过滤false的arr数组 
var arrTrue = new Array; 
$.each(arr, function(i) { 
if (arr[i] == true) { 
arrTrue.push(arr[i]); 
} 
}); 
//当然也可以用grep函数,来简化过滤arr数组操作 
//arr = $.grep(arr, function(n, i) { 
//return n == true; 
//}); 
var groupLen = Math.floor($("table[id^=ctl]").length + 1 / 3); 
//最后,简单一点吧,只有判断arrTrue的长度是否为11,就可以。 
//因为是一共33个radiobutton,每3个为一组,规则又是一组中3选1, //所以全部选择肯定有11个radiobutton被选中。 
if (arrTrue.length != groupLen) { 
flag = false; 
} 
return false; 
});

完整代码
$(function() { 
$("#<%= ibSubmit.ClientID%>").click(function() { 
var flag = true; 
var arr = new Array; 
$("table[id^=ctl] input[type=radio]").each(function(i) { 
arr.push(this.checked); 
}); 
arr = $.grep(arr, function(n) { 
return n == true; 
}); 
var groupLen = Math.floor($("table[id^=ctl]").length + 1 / 3); 
if (arr.length != groupLen) { 
flag = false; 
} 
return false; 
}); 
});

最后附上生成Table代码:(两种生成方法,JQuery版本,C#版本) ? (可看可不看)

jQuery版本

var array = ["XXXX",""XXXX","XXX"]; 
$.each(array, function(i) { 
table.append("<tr><td>"+ 
"<input id='cbl_" + i + "'" + " type='checkbox' title='" + array[0] + "' />" + 
"</td></tr>"); 
});
Javascript 相关文章推荐
xtree.js 代码
Mar 13 Javascript
jQuery.Autocomplete实现自动完成功能(详解)
Jul 13 Javascript
Bookmarklet实现启动jQuery(模仿 云输入法)
Sep 15 Javascript
如何使用jquery控制CSS样式,并且取消Css样式(如背景色,有实例)
Jul 09 Javascript
鼠标悬浮停留三秒后自动显示大图js代码
Sep 09 Javascript
JavaScript 表单处理实现代码
Apr 13 Javascript
JavaScript编程中实现对象封装特性的实例讲解
Jun 24 Javascript
JavaScript中闭包之浅析解读(必看篇)
Aug 25 Javascript
vue.js 获取select中的value实例
Mar 01 Javascript
解决IE11 vue +webpack 项目中数据更新后页面没有刷新的问题
Sep 25 Javascript
layer.confirm()右边按钮实现href的例子
Sep 27 Javascript
javascript实现鼠标点击生成文字特效
Dec 24 Javascript
使用jQuery插件创建常规模态窗口登陆效果
Aug 23 #Javascript
Jquery绑定事件(bind和live的区别介绍)
Aug 23 #Javascript
鼠标移到导航当前位置的LI变色处于选中状态
Aug 23 #Javascript
高效率JavaScript编写技巧整理
Aug 23 #Javascript
处理及遍历XML文档DOM元素属性及方法整理
Aug 23 #Javascript
JavaScript语言核心数据类型和变量使用介绍
Aug 23 #Javascript
Javascript表格翻页效果实现思路及代码
Aug 23 #Javascript
You might like
php输出echo、print、print_r、printf、sprintf、var_dump的区别比较
2013/06/21 PHP
Yii2框架配置文件(Application属性)与调试技巧实例分析
2019/05/27 PHP
从sohu弄下来的flash中展示图片的代码
2007/04/27 Javascript
javascript URL锚点取值方法
2009/02/25 Javascript
JavaScript iframe数据共享接口实现方法
2016/01/06 Javascript
JavaScript获取IP获取的是IPV6 如何校验
2016/06/12 Javascript
ES6新特性之解构、参数、模块和记号用法示例
2017/04/01 Javascript
jQuery 1.9版本以上的浏览器判断方法代码分享
2017/08/28 jQuery
从零开始搭建一个react项目开发
2018/02/09 Javascript
VUE单页面切换动画代码(全网最好的切换效果)
2019/10/31 Javascript
vue element-ui el-date-picker限制选择时间为当天之前的代码
2019/11/07 Javascript
JavaScript中this函数使用实例解析
2020/02/21 Javascript
vue使用swiper实现左右滑动切换图片
2020/10/16 Javascript
Python抓取手机号归属地信息示例代码
2016/11/28 Python
python 递归遍历文件夹,并打印满足条件的文件路径实例
2017/08/30 Python
把csv文件转化为数组及数组的切片方法
2018/07/04 Python
python中的字符串内部换行方法
2018/07/19 Python
Python脚本利用adb进行手机控制的方法
2019/07/08 Python
面向中国市场的在线海淘美妆零售网站:Beauty House美丽屋
2021/03/02 全球购物
加拿大户外探险购物网站:SAIL
2020/06/27 全球购物
档案检查欢迎词
2014/01/13 职场文书
全民健身日活动方案
2014/01/29 职场文书
三下乡活动方案
2014/01/31 职场文书
请假条格式范文
2014/04/10 职场文书
市场开发计划书
2014/05/07 职场文书
幼儿园家长安全责任书
2014/07/22 职场文书
大学竞选班干部演讲稿
2014/08/21 职场文书
检讨书怎么写
2015/01/23 职场文书
暂住证明怎么写
2015/06/19 职场文书
小学学习委员竞选稿
2015/11/20 职场文书
2016小学优秀教师先进事迹材料
2016/02/26 职场文书
工作报告范文
2019/06/20 职场文书
2019最新版股权转让及委托持股协议书范本
2019/08/07 职场文书
最新农村养殖致富:资金投入较低的创业项目有哪些?
2019/09/26 职场文书
一行代码python实现文件共享服务器
2021/04/22 Python
Python机器学习三大件之一numpy
2021/05/10 Python