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 调试利器 Firebug使用详解六
Jul 05 Javascript
Javascript基础知识(三)BOM,DOM总结
Sep 29 Javascript
Javascript基础教程之if条件语句
Jan 18 Javascript
jQuery实现内容定时切换效果完整实例
Apr 06 Javascript
工厂模式在JS中的实践
Jan 18 Javascript
VueJs组件prop验证简单介绍
Sep 12 Javascript
Mongoose中document与object的区别示例详解
Sep 18 Javascript
基于js中的存储键值对以及注意事项介绍
Mar 30 Javascript
vue 中的keep-alive实例代码
Jul 20 Javascript
使用vue开发移动端管理后台的注意事项
Mar 07 Javascript
vue中created和mounted的区别浅析
Aug 13 Javascript
js实现GIF图片的分解和合成
Oct 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 setcookie指定domain参数后,在IE下设置cookie失效的解决方法
2011/09/09 PHP
深入phpMyAdmin的安装与配置的详细步骤
2013/05/07 PHP
开源php中文分词系统SCWS安装和使用实例
2014/04/11 PHP
PHP mysql事务问题实例分析
2016/01/18 PHP
PHP删除数组中指定值的元素常用方法实例分析【4种方法】
2018/08/21 PHP
Aster vs KG BO3 第二场2.18
2021/03/10 DOTA
firefox 和 ie 事件处理的细节,研究,再研究 书写同时兼容ie和ff的事件处理代码
2007/04/12 Javascript
总结AJAX相关JS代码片段和浏览器模型
2007/08/15 Javascript
JS检测图片大小的实例
2013/08/21 Javascript
浅析node连接数据库(express+mysql)
2015/11/30 Javascript
浅析2种JavaScript继承方式
2015/12/04 Javascript
理解Angular数据双向绑定
2016/01/10 Javascript
javascript实现2016新年版日历
2016/01/25 Javascript
通过javascript进行UTF-8编码的实现方法
2016/06/27 Javascript
Jquery遍历select option和添加移除option的实现方法
2016/08/26 Javascript
JavaScript实现通过select标签跳转网页的方法
2016/09/29 Javascript
JS实现JSON.stringify的实例代码讲解
2017/02/07 Javascript
详解Node中导入模块require和import的区别
2017/08/11 Javascript
响应式框架Bootstrap栅格系统的实例
2017/12/19 Javascript
vue.js 2.0实现简单分页效果
2019/07/29 Javascript
NUXT SSR初级入门笔记(小结)
2019/12/16 Javascript
vue项目中播放rtmp视频文件流的方法
2020/09/17 Javascript
[02:19]DOTA2上海特级锦标赛 观赛指南 Spectator Guide
2016/02/04 DOTA
python操作文件的参数整理
2019/06/11 Python
基于pandas中expand的作用详解
2019/12/17 Python
浅谈Python线程的同步互斥与死锁
2020/03/22 Python
Python3+Flask安装使用教程详解
2021/02/16 Python
Html5如何唤起百度地图App的方法
2019/01/27 HTML / CSS
美国大尺码女装零售商:TORRID
2016/10/01 全球购物
New Balance天猫官方旗舰店:始于1906年,百年慢跑品牌
2017/11/15 全球购物
英国家用电器购物网站:Hughes
2018/02/23 全球购物
德国隐形眼镜店:LuckyLens
2018/07/29 全球购物
自我评价优秀范文分享
2013/11/30 职场文书
学校教研活动总结
2014/07/02 职场文书
2015年党员创先争优承诺书
2015/01/22 职场文书
学校元旦晚会开场白
2015/05/29 职场文书