javascript获取checkbox复选框获取选中的选项


Posted in Javascript onAugust 12, 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);
}

}
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 相关文章推荐
实例:尽可能写友好的Javascript代码
Oct 09 Javascript
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
Aug 14 Javascript
使用Sticker.js实现贴纸效果
Jan 28 Javascript
javascript实现限制上传文件大小
Feb 06 Javascript
JS查找字符串中出现次数最多的字符
Sep 05 Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 Javascript
Ajax 加载数据 练习代码
Jan 05 Javascript
详解react使用react-bootstrap当轮子造车
Aug 15 Javascript
jQuery实现的弹幕效果完整实例
Sep 06 jQuery
vue.js中proxyTable 转发请求的实现方法
Sep 20 Javascript
JavaScript检查数据中是否存在相同的元素(两种方法)
Oct 07 Javascript
详解JavaScript中typeof与instanceof用法
Oct 24 Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
Aug 12 #Javascript
JS、CSS以及img对DOMContentLoaded事件的影响
Aug 12 #Javascript
更快的异步执行(setTimeout多浏览器)
Aug 12 #Javascript
JavaScript Promise启示录
Aug 12 #Javascript
深入理解Javascript中this的作用域
Aug 12 #Javascript
javascript实现在某个元素上阻止鼠标右键事件的方法和实例
Aug 12 #Javascript
JavaScript弹出窗口方法汇总
Aug 12 #Javascript
You might like
php 远程关机操作的代码
2008/12/05 PHP
PHP对象转换为数组函数(递归方法)
2012/02/04 PHP
thinkPHP下ueditor的使用方法详解
2015/12/26 PHP
php实现将HTML页面转换成word并且保存的方法
2016/10/14 PHP
yii2中LinkPager增加总页数和总记录数的实例
2017/08/28 PHP
Javascript 函数中的参数使用分析
2010/03/27 Javascript
jQuery代码优化之基本事件
2011/11/01 Javascript
javascript实用小函数使用介绍
2013/11/11 Javascript
jquery ztree实现下拉树形框使用到了json数据
2014/05/14 Javascript
轻松学习jQuery插件EasyUI EasyUI实现拖放商品放置购物车
2015/11/30 Javascript
jQuery 获取跨域XML(RSS)数据的相关总结分析
2016/05/18 Javascript
Bootstrap导航中表单简单实现代码
2017/03/06 Javascript
解决Vue页面固定滚动位置的处理办法
2017/07/13 Javascript
读懂CommonJS的模块加载
2019/04/19 Javascript
javascript如何实现create方法
2019/11/04 Javascript
js实现3D旋转相册
2020/08/02 Javascript
小程序实现上传视频功能
2020/08/18 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
2021/01/11 Javascript
python实现给字典添加条目的方法
2014/09/25 Python
Python基于list的append和pop方法实现堆栈与队列功能示例
2017/07/24 Python
SVM基本概念及Python实现代码
2017/12/27 Python
Python 改变数组类型为uint8的实现
2020/04/09 Python
Python如何给你的程序做性能测试
2020/07/29 Python
django和flask哪个值得研究学习
2020/07/31 Python
Python os库常用操作代码汇总
2020/11/03 Python
python 通过 pybind11 使用Eigen加速代码的步骤
2020/12/07 Python
如何利用Python matplotlib绘制雷达图
2020/12/21 Python
anaconda安装pytorch1.7.1和torchvision0.8.2的方法(亲测可用)
2021/02/01 Python
简述数组与指针的区别
2014/01/02 面试题
光声世纪笔试题目
2012/08/25 面试题
运动会广播稿50字
2015/08/19 职场文书
追悼会答谢词范文
2015/09/29 职场文书
《花钟》教学反思
2016/02/17 职场文书
go语言求任意类型切片的长度操作
2021/04/26 Golang
jQuery实现广告显示和隐藏动画
2021/07/04 jQuery
Springboot-cli 开发脚手架,权限认证,附demo演示
2022/04/28 Java/Android