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 相关文章推荐
jquery中的sortable排序之后的保存状态的解决方法
Jan 28 Javascript
jQuery基本过滤选择器使用介绍
Apr 18 Javascript
JS建造者模式基本用法实例分析
Jun 30 Javascript
Clipboard.js 无需Flash的JavaScript复制粘贴库
Oct 02 Javascript
js实现添加可信站点、修改activex安全设置,禁用弹出窗口阻止程序
Aug 17 Javascript
Bootstrap fileinput组件封装及使用详解
Mar 10 Javascript
详解Angular2响应式表单
Jun 14 Javascript
Vue2.0基于vue-cli+webpack父子组件通信(实例讲解)
Sep 14 Javascript
无限循环轮播图之运动框架(原生JS实现)
Oct 01 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
Jan 18 Javascript
Vue 组件注册实例详解
Feb 23 Javascript
简单了解前端渐进式框架VUE
Jul 20 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
完美解决dedecms中的[html][/html]和[code][/code]问题
2007/03/20 PHP
PHP中文件上传的一个问题
2010/09/04 PHP
PHP提示Cannot modify header information - headers already sent by解决方法
2014/09/22 PHP
PHP使用trim函数去除字符串左右空格及特殊字符实例
2016/01/07 PHP
使用PHPExcel实现数据批量导出为excel表格的方法(必看)
2017/06/09 PHP
PHP调用全国天气预报数据接口查询天气示例
2019/02/20 PHP
Laravel框架集成UEditor编辑器的方法图文与实例详解
2019/04/17 PHP
分享一个用Mootools写的鼠标滑过进度条改变进度值的实现代码
2011/12/12 Javascript
JavaScript代码复用模式实例分析
2012/12/02 Javascript
JS或jQuery获取ASP.NET服务器控件ID的方法
2015/06/08 Javascript
JavaScript实现文字跟随鼠标特效
2015/08/06 Javascript
微信小程序 template模板详解及实例代码
2017/03/09 Javascript
JavaScrip数组删除特定元素的几种方法总结
2017/09/06 Javascript
javascript高级模块化require.js的具体使用方法
2017/10/31 Javascript
微信小程序左右滑动的实现代码
2017/12/15 Javascript
Vue仿支付宝支付功能
2018/05/25 Javascript
原生JS实现动态加载js文件并在加载成功后执行回调函数的方法
2020/12/30 Javascript
element el-input directive数字进行控制
2018/10/11 Javascript
Node.js如何对SQLite的async/await封装详解
2019/02/14 Javascript
jQuery实现可编辑的表格
2019/12/11 jQuery
如何实现iframe父子传参通信
2020/02/05 Javascript
微信小程序学习总结(四)事件与冒泡实例分析
2020/06/04 Javascript
Kettle中使用JavaScrip调用jar包对文件内容进行MD5加密的操作方法
2020/09/04 Javascript
举例详解Python中的split()函数的使用方法
2015/04/07 Python
Python pickle模块用法实例
2015/04/14 Python
简单介绍Python的Django框架加载模版的方式
2015/07/20 Python
django连接oracle时setting 配置方法
2019/08/29 Python
python语言实现贪吃蛇游戏
2020/11/13 Python
马来西亚航空官方网站:Malaysia Airlines
2017/07/28 全球购物
学生吸烟检讨书
2014/09/14 职场文书
2014红色之旅心得体会
2014/10/07 职场文书
中小学生安全教育观后感
2015/06/17 职场文书
基层工作经历证明
2015/06/19 职场文书
解决numpy和torch数据类型转化的问题
2021/05/23 Python
浅谈Java实现分布式事务的三种方案
2021/06/11 Java/Android
Java数组详细介绍及相关工具类
2022/04/14 Java/Android