js获取checkbox复选框选中的选项实例


Posted in Javascript onAugust 24, 2014

有关javascript 获取checkbox复选框的实例数不胜数。
js实现:

var form = document.getElementById("form2");

var field = form.elements["test2"];
var option = Dining.getSelectedOption(form, field);
var message = "";
for (var i = 0, len = option.length; i < len; i++) {
message += "Select id:" + option[i].id + "\nSelected name:" + option[i].name + "\nSelected value:" + option[i].value + "\n\n";
}
alert(message);
/*获取选中的选项*/
getSelectedOption: function (selectform, selectionfield) {
var result = [];
var option = null;
for (var i = 0; i < selectionfield.length; i++) {
option = selectionfield[i];
if (option.checked) {
result.push(option);
} 3water.com

}
return result;

}
<form id='form2'>

<label>排序:</label><input id='aaaaa' type='checkbox' name='test2' value='1'>

<label for='aaaaa'>月销量</label><input id='bbbbb' type='checkbox' name='test2' value='2'>

<label for='bbbbb'>评分</label><input id='ccccc' type='checkbox' name='test2' value='3'>

<label for='ccccc'>优惠</label> <br style='clear:both'><label>分类:</label><input id='ddddd' type='checkbox' name='test2' value='4'>

<label for='ddddd'>商务套餐</label><input id='eeeee' type='checkbox' name='test2' value='5'>

<label for='eeeee'>凉菜</label><input id='fffff' type='checkbox' name='test2' value='6'>

</form>",
Javascript 相关文章推荐
bcastr2.0 通用的图片浏览器
Nov 22 Javascript
jquery.validate使用攻略 第五步 正则验证
Jul 01 Javascript
myEvent.js javascript跨浏览器事件框架
Oct 24 Javascript
解决jQuery动态获取手机屏幕高和宽的问题
May 07 Javascript
JavaScript编程中实现对象封装特性的实例讲解
Jun 24 Javascript
JS组件系列之JS组件封装过程详解
Apr 28 Javascript
使用vue脚手架(vue-cli)搭建一个项目详解
May 09 Javascript
了解JavaScript中let语句
May 30 Javascript
vue 中 命名视图的用法实例详解
Aug 14 Javascript
微信小程序如何实现在线客服功能
Oct 16 Javascript
小程序如何定位所在城市及发起周边搜索
Feb 11 Javascript
编写v-for循环的技巧汇总
Dec 01 Javascript
jQuery异步加载数据并添加事件示例
Aug 24 #Javascript
Jquery通过JSON字符串创建JSON对象
Aug 24 #Javascript
Jquery中扩展方法extend使用技巧
Aug 24 #Javascript
jquery使用$(element).is()来判断获取的tagName
Aug 24 #Javascript
jQuery响应鼠标事件并隐藏与显示input默认值
Aug 24 #Javascript
js delete 用法(删除对象属性及变量)
Aug 24 #Javascript
JQuery实现动态表格点击按钮表格增加一行
Aug 24 #Javascript
You might like
使用php清除bom示例
2014/03/03 PHP
ThinkPHP模板输出display用法分析
2014/11/26 PHP
PHP实现基于文本的摩斯电码生成器
2016/01/11 PHP
PHP中数组转换为SimpleXML教程
2019/01/27 PHP
TP5框架实现自定义分页样式的方法示例
2020/04/05 PHP
jquery 列表双向选择器之改进版
2013/08/09 Javascript
JavaScript中的Math 使用介绍
2014/04/21 Javascript
javascript对中文按照拼音排序代码
2014/08/20 Javascript
纯js实现仿QQ邮箱弹出确认框
2015/04/29 Javascript
vue.js组件之间传递数据的方法
2017/07/10 Javascript
JavaScript Canvas实现验证码
2020/08/02 Javascript
ios设备中angularjs无法改变页面title的解决方法
2018/09/13 Javascript
JavaScript的词法结构精华篇
2018/10/17 Javascript
JS中使用new Option()实现时间联动效果
2018/12/10 Javascript
jQuery实现适用于移动端的跑马灯抽奖特效示例
2019/01/18 jQuery
小程序getLocation需要在app.json中声明permission字段
2019/04/04 Javascript
express + jwt + postMan验证实现持久化登录
2019/06/05 Javascript
如何使用50行javaScript代码实现简单版的call,apply,bind
2019/08/14 Javascript
js基于canvas实现时钟组件
2021/02/07 Javascript
Python实现的多线程同步与互斥锁功能示例
2017/11/30 Python
python实现对excel进行数据剔除操作实例
2017/12/07 Python
Django-Rest-Framework 权限管理源码浅析(小结)
2018/11/12 Python
淘宝秒杀python脚本 扫码登录版
2019/09/19 Python
Python新手如何进行闭包时绑定变量操作
2020/05/29 Python
Django serializer优化类视图的实现示例
2020/07/16 Python
如何判断一段程序是由C 编译程序还是由C++编译程序编译的
2013/08/04 面试题
手机促销活动方案
2014/02/05 职场文书
机关门卫的岗位职责
2014/04/29 职场文书
生日庆典策划方案
2014/06/02 职场文书
完整版商业计划书
2014/09/15 职场文书
外贸业务员岗位职责
2015/02/13 职场文书
2015军训通讯稿大全
2015/07/18 职场文书
HTML中table表格拆分合并(colspan、rowspan)
2021/04/07 HTML / CSS
http通过StreamingHttpResponse完成连续的数据传输长链接方式
2022/02/12 Python
Node.js实现爬取网站图片的示例代码
2022/04/04 NodeJs
win10拖拽文件时崩溃怎么解决?win10文件不能拖拽问题解决方法
2022/08/14 数码科技