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 相关文章推荐
JavaScript编程开发中的五个实用小技巧
Jul 22 Javascript
javascript代码运行不出来执行错误的可能情况整理
Oct 18 Javascript
javascript中的括号()用法小结
Apr 14 Javascript
jquery复选框多选赋值给文本框的方法
Jan 27 Javascript
JS实现向表格行添加新单元格的方法
Mar 30 Javascript
jQuery $.each遍历对象、数组用法实例
Apr 16 Javascript
基于canvas实现的钟摆效果完整实例
Jan 26 Javascript
详解vue项目中使用token的身份验证的简单实践
Mar 08 Javascript
js如何实现元素曝光上报
Aug 07 Javascript
javascript 设计模式之组合模式原理与应用详解
Apr 08 Javascript
Vue关于组件化开发知识点详解
May 13 Javascript
详解Vue 的异常处理机制
Nov 30 Vue.js
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
Smarty结合Ajax实现无刷新留言本实例
2007/01/02 PHP
php四种定界符详解
2017/02/16 PHP
javascript jQuery $.post $.ajax用法
2008/07/09 Javascript
JQuery 构建客户/服务分离的链接模型中Table中的排序分析
2010/01/22 Javascript
jquery 查找新建元素代码
2010/07/06 Javascript
分享一个自己写的table表格排序js插件(高效简洁)
2011/10/29 Javascript
js模仿hover的具体实现代码
2013/12/30 Javascript
node.js中的path.sep方法使用说明
2014/12/08 Javascript
JavaScript插件化开发教程(六)
2015/02/01 Javascript
jquery控制表单输入框显示默认值的方法
2015/05/22 Javascript
JQuery实现的图文自动轮播效果插件
2015/06/19 Javascript
jQuery的bind()方法使用详解
2015/07/15 Javascript
AngularJs页面筛选标签小功能
2016/08/01 Javascript
AngularJS 2.0入门权威指南
2016/10/08 Javascript
Vue响应式添加、修改数组和对象的值
2017/03/20 Javascript
Vue中的Vux配置指南
2017/12/08 Javascript
Vue filter 过滤器、以及在table中的使用介绍
2020/09/07 Javascript
ant design pro中可控的筛选和排序实例
2020/11/17 Javascript
python mysqldb连接数据库
2009/03/16 Python
Python单元测试框架unittest使用方法讲解
2015/04/13 Python
Python实现图片转字符画的示例
2017/08/22 Python
Python面向对象编程基础解析(一)
2017/10/26 Python
python读取LMDB中图像的方法
2018/07/02 Python
CentOS6.9 Python环境配置(python2.7、pip、virtualenv)
2019/05/06 Python
Python实现FM算法解析
2019/06/18 Python
用python爬取历史天气数据的方法示例
2019/12/30 Python
Lulu Guinness露露·吉尼斯官网:红唇包
2019/02/03 全球购物
Java平台和其他软件平台有什么不同
2015/06/05 面试题
副厂长岗位职责
2014/02/02 职场文书
表彰会主持词
2014/03/26 职场文书
动漫设计与制作专业推荐信
2014/07/07 职场文书
“四风”问题对照检查材料思想汇报
2014/09/16 职场文书
自查自纠工作情况报告
2014/10/29 职场文书
幼师求职自荐信
2015/03/26 职场文书
二审答辩状范文
2015/05/22 职场文书
Pytest中skip skipif跳过用例详解
2021/06/30 Python