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 相关文章推荐
基于JQuery的简单实现折叠菜单代码
Sep 15 Javascript
jQuery实现表头固定效果的实例代码
May 24 Javascript
图片动画横条广告带上下滚动的JS代码
Oct 25 Javascript
from表单多个按钮提交用onclick跳转不同action
Apr 24 Javascript
php和js对数据库图片进行等比缩放示例
Apr 28 Javascript
angularjs创建弹出框实现拖动效果
Aug 25 Javascript
基于jQuery实现的无刷新表格分页实例
Feb 17 Javascript
使用JS中的Replace()方法遇到的问题小结
Oct 20 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
Feb 08 Javascript
vue服务端渲染缓存应用详解
Sep 12 Javascript
使用electron将vue-cli项目打包成exe的方法
Sep 29 Javascript
node.js中module模块的功能理解与用法实例分析
Feb 14 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
zf框架的校验器使用使用示例(自定义校验器和校验器链)
2014/03/13 PHP
Yii2压缩PHP中模板代码的输出问题
2018/08/28 PHP
PHP PDOStatement::fetchObject讲解
2019/02/01 PHP
深入学习微信网址链接解封的防封原理visit_type
2019/08/15 PHP
Javascript 浮点运算的问题分析与解决方法
2013/08/27 Javascript
js实现TAB切换对应不同颜色的代码
2015/08/31 Javascript
解析Node.js基于模块和包的代码部署方式
2016/02/16 Javascript
JavaScript 浏览器兼容性总结及常用浏览器兼容性分析
2016/03/30 Javascript
jQuery实现页面滚动时智能浮动定位
2017/01/08 Javascript
Bootstrap布局之栅格系统学习笔记
2017/05/04 Javascript
在 Vue.js中优雅地使用全局事件的方法
2019/02/01 Javascript
layui异步加载table表中某一列数据的例子
2019/09/16 Javascript
React Native 混合开发多入口加载方式详解
2019/09/23 Javascript
Express 配置HTML页面访问的实现
2020/11/01 Javascript
[01:06] DOTA2英雄背景故事第三期之秩序法则光之守卫
2020/07/07 DOTA
详解在Python和IPython中使用Docker
2015/04/28 Python
Python判断两个对象相等的原理
2017/12/12 Python
windows下python安装小白入门教程
2018/09/18 Python
Python 运行.py文件和交互式运行代码的区别详解
2019/07/02 Python
cProfile Python性能分析工具使用详解
2019/07/22 Python
Flask使用Pyecharts在单个页面展示多个图表的方法
2019/08/05 Python
Python virtualenv虚拟环境实现过程解析
2020/04/18 Python
基于python实现破解滑动验证码过程解析
2020/05/28 Python
基于OpenCV的路面质量检测的实现
2020/11/04 Python
爱淘宝:淘宝网购物分享平台
2017/04/28 全球购物
Shoes For Crews法国官网:美国领先的防滑鞋设计和制造商
2018/01/01 全球购物
得到Class的三个过程是什么
2012/08/10 面试题
计算机专业自荐信
2013/10/14 职场文书
机械设计专业应届生求职信
2013/11/21 职场文书
寒假思想汇报
2014/01/10 职场文书
运动会开幕式主持词
2014/03/28 职场文书
助人为乐道德模范事迹材料
2014/08/16 职场文书
2015年“7.11”世界人口日宣传活动方案
2015/05/06 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
HTML常用标签超详细整理
2022/03/19 HTML / CSS
优化Mysql查询的示例
2022/04/26 MySQL