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 相关文章推荐
javascript for循环从入门到偏门(效率优化+奇特用法)
Aug 01 Javascript
js获取网页高度(详细整理)
Dec 28 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
JQuery打造省市下拉框联动效果
May 18 Javascript
JavaScript中的公有、私有、特权和静态成员用法分析
Nov 20 Javascript
javascript实现字符串反转的方法
Feb 05 Javascript
如何在Linux上安装Node.js
Apr 01 Javascript
jQuery实现checkbox列表的全选、反选功能
Nov 24 Javascript
Angular2 组件间通过@Input @Output通讯示例
Aug 24 Javascript
浅谈Vue页面级缓存解决方案feb-alive(上)
Apr 14 Javascript
jQuery位置选择器用法实例分析
Jun 28 jQuery
Koa从零搭建到Api实现项目的搭建方法
Jul 30 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加密解密的代码
2006/10/09 PHP
基于mysql的bbs设计(一)
2006/10/09 PHP
php实现网站留言板功能
2015/11/04 PHP
thinkPHP js文件中U方法不被解析问题的解决方法
2016/12/05 PHP
PHP实现数组向任意位置插入,删除,替换数据操作示例
2019/04/05 PHP
23个超流行的jQuery相册插件整理分享
2011/04/25 Javascript
jQuery右键菜单contextMenu使用实例
2011/09/28 Javascript
JavaScript中为什么null==0为false而null大于=0为true(个人研究)
2013/09/16 Javascript
JS选中checkbox后获取table内一行TD所有数据的方法
2015/07/01 Javascript
常用的Javascript设计模式小结
2015/12/09 Javascript
javascript的 {} 语句块详解
2016/02/27 Javascript
深入浅析vue组件间事件传递
2017/12/29 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
2018/06/10 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
2018/07/26 Javascript
详解a标签添加onclick事件的几种方式
2019/03/29 Javascript
小程序关于请求同步的总结
2019/05/05 Javascript
小程序中手机号识别的示例
2020/12/14 Javascript
给Python入门者的一些编程建议
2015/06/15 Python
python使用两种发邮件的方式smtp和outlook示例
2017/06/02 Python
Python实现的文本编辑器功能示例
2017/06/30 Python
python中MethodType方法介绍与使用示例
2017/08/03 Python
用python结合jieba和wordcloud实现词云效果
2017/09/05 Python
python使用response.read()接收json数据的实例
2018/12/19 Python
Python3内置模块random随机方法小结
2019/07/13 Python
Python基于yield遍历多个可迭代对象
2020/03/12 Python
Python批量将图片灰度化的实现代码
2020/04/11 Python
详解selenium + chromedriver 被反爬的解决方法
2020/10/28 Python
canvas实现图片马赛克的示例代码
2018/03/26 HTML / CSS
HTML5高仿微信聊天、微信聊天表情|对话框|编辑器功能
2018/04/23 HTML / CSS
FitFlop美国官网:英国符合人体工学的鞋类品牌
2018/10/05 全球购物
高中的职业生涯规划书
2013/12/28 职场文书
给朋友的道歉信
2014/01/09 职场文书
军训自我鉴定
2014/01/22 职场文书
大专生求职信
2014/06/29 职场文书
2014应届本科生自我评价
2014/09/13 职场文书
关于nginx 实现jira反向代理的问题
2021/09/25 Servers