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 相关文章推荐
js给onclick事件赋值,动态传参数实例解说
Mar 28 Javascript
javascript中不等于的代码是什么怎么写
Dec 29 Javascript
JavaScript截取字符串的Slice、Substring、Substr函数详解和比较
Mar 20 Javascript
javascript中call apply 的应用场景
Apr 16 Javascript
JavaScript实现选择框按比例拖拉缩放的方法
Aug 04 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
Apr 01 Javascript
微信小程序 教程之wxapp视图容器 scroll-view
Oct 19 Javascript
JS和canvas实现俄罗斯方块
Mar 14 Javascript
深入理解ES6学习笔记之块级作用域绑定
Aug 19 Javascript
JS实现判断图片是否加载完成的方法分析
Jul 31 Javascript
Vue中图片Src使用变量的方法
Oct 30 Javascript
微信小程序onShareTimeline()实现分享朋友圈
Jan 07 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操作mysql函数详解,mysql和php交互函数
2011/05/19 PHP
PHP header函数分析详解
2011/08/06 PHP
PHP中mysql_field_type()函数用法
2014/11/24 PHP
PHP针对JSON操作实例分析
2015/01/12 PHP
PHP开发注意事项总结
2015/02/04 PHP
PHP加密解密实例分析
2015/12/25 PHP
Thinkphp极验滑动验证码实现步骤解析
2020/11/24 PHP
一个简单的JavaScript数据缓存系统实现代码
2010/10/24 Javascript
10个基于Jquery的幻灯片插件教程
2010/10/29 Javascript
js实现的跟随鼠标移动的时钟效果(中英文日期显示)
2011/01/17 Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
2012/02/10 Javascript
JS控制图片翻转示例代码(兼容firefox,ie,chrome)
2013/12/19 Javascript
Javascript中使用A标签获取当前目录的绝对路径方法
2015/03/02 Javascript
分享Javascript实用方法二
2015/12/13 Javascript
bootstrap与Jquery UI 按钮样式冲突的解决办法
2016/09/23 Javascript
JS实现仿百度文库评分功能
2017/01/12 Javascript
多个上传文件用js验证文件的格式和大小的方法(推荐)
2017/03/09 Javascript
浅析JS中的 map, filter, some, every, forEach, for in, for of 用法总结
2017/03/29 Javascript
Vue中保存数据到磁盘文件的方法
2018/09/06 Javascript
vue this.reload 方法 配置
2018/09/12 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
2020/06/28 Javascript
Python获取DLL和EXE文件版本号的方法
2015/03/10 Python
Python性能提升之延迟初始化
2016/12/04 Python
基于python实现在excel中读取与生成随机数写入excel中
2018/01/04 Python
python实现旋转和水平翻转的方法
2018/10/25 Python
解决webdriver.Chrome()报错:Message:'chromedriver' executable needs to be in Path
2019/06/12 Python
Python+OpenCV实现实时眼动追踪的示例代码
2019/11/11 Python
详解python 降级到3.6终极解决方案
2020/02/06 Python
PyCharm刷新项目(文件)目录的实现
2020/02/14 Python
python实现word文档批量转成自定义格式的excel文档的思路及实例代码
2020/02/21 Python
python+Selenium自动化测试——输入,点击操作
2020/03/06 Python
Python的PIL库中getpixel方法的使用
2020/04/09 Python
物理专业大学生职业生涯规划书
2014/02/07 职场文书
成本会计岗位职责
2015/02/03 职场文书
新员工入职感想
2015/08/07 职场文书
一文搞懂如何实现Go 超时控制
2021/03/30 Python