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 相关文章推荐
非html5实现js版弹球游戏示例代码
Sep 22 Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
Nov 22 Javascript
JavaScript输入邮箱自动提示实例代码
Jan 13 Javascript
jQuery实现多级联动下拉列表查询框
Jan 18 Javascript
Bootstrap CSS组件之大屏幕展播
Dec 17 Javascript
Node.js数据库操作之连接MySQL数据库(一)
Mar 04 Javascript
jQuery 利用ztree实现树形表格的实例代码
Sep 27 jQuery
使用vue点击li,获取当前点击li父辈元素的属性值方法
Sep 12 Javascript
jQuery AJAX与jQuery事件的分析讲解
Feb 18 jQuery
移动端手指操控左右滑动的菜单
Sep 08 Javascript
vue 路由子组件created和mounted不起作用的解决方法
Nov 05 Javascript
详解JavaScript 中的批处理和缓存
Nov 19 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代码
2013/11/19 PHP
thinkphp循环结构用法实例
2014/11/24 PHP
php中时间函数date及常用的时间计算
2017/05/12 PHP
PHP使用栈解决约瑟夫环问题算法示例
2017/08/27 PHP
THINKPHP-Apache服务器中使用Alias虚拟目录URL重写 隐藏index.php
2021/03/09 PHP
JavaScript 页面坐标相关知识整理
2010/01/09 Javascript
Javascript根据指定下标或对象删除数组元素
2012/12/21 Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
2015/04/27 Javascript
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
2016/06/02 Javascript
关于两个jQuery(js)特效冲突的bug的解决办法
2016/09/04 Javascript
手机浏览器 后退按钮强制刷新页面方法总结
2016/10/09 Javascript
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
2017/09/20 jQuery
使用Vue.js开发微信小程序开源框架mpvue解析
2018/03/20 Javascript
vue-router 源码之实现一个简单的 vue-router
2018/07/02 Javascript
微信小程序实现自上而下字幕滚动
2018/07/14 Javascript
使用layer弹窗和layui表单实现新增功能
2018/08/09 Javascript
JavaScript数组特性与实践应用深入详解
2018/12/30 Javascript
如何基于vue-cli3.0构建功能完善的移动端架子
2019/04/24 Javascript
React优化子组件render的使用
2019/05/12 Javascript
详解ECMAScript2019/ES10新属性
2019/12/06 Javascript
node.js开发辅助工具nodemon安装与配置详解
2020/02/06 Javascript
使用vue实现HTML页面生成图片的方法
2020/03/12 Javascript
解决Antd Table表头加Icon和气泡提示的坑
2020/11/17 Javascript
[03:28]2014DOTA2国际邀请赛 走近EG战队天才中单Arteezy
2014/07/12 DOTA
Python写的PHPMyAdmin暴力破解工具代码
2014/08/06 Python
python opencv设置摄像头分辨率以及各个参数的方法
2018/04/02 Python
Pandas之DataFrame对象的列和索引之间的转化
2019/06/25 Python
基于python中__add__函数的用法
2019/11/25 Python
Vs Code中8个好用的python 扩展插件
2020/10/12 Python
函授毕业生自我鉴定范文
2014/03/25 职场文书
社区安全生产月活动总结
2014/07/05 职场文书
银行贷款委托书范本
2014/10/11 职场文书
师德师风事迹材料
2014/12/20 职场文书
高中生思想道德自我评价
2015/03/09 职场文书
春季运动会加油词
2015/07/18 职场文书
nginx 配置指令之location使用详解
2022/05/25 Servers