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

 更新时间:2014年08月12日 16:53:16   投稿:whsnow  
这篇文章主要介绍了javascript获取checkbox复选框获取选中的选项的方法,需要的朋友可以参考下

有关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>",

相关文章

  • js constructor的实际作用分析

    js constructor的实际作用分析

    大家讨论下constructor的作用哈,需要的朋友可以参考下。从51js摘编而来。
    2011-11-11
  • 微信小程序连接MySQL数据库的全过程

    微信小程序连接MySQL数据库的全过程

    微信小程序是不能直接连接数据库进行数据操作的,这是出于安全的考虑,下面这篇文章主要给大家介绍了关于微信小程序连接MySQL数据库的全过程,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-01-01
  • JavaScript中window和document用法详解

    JavaScript中window和document用法详解

    这篇文章主要介绍了JavaScript中window和document用法详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-07-07
  • JS 循环li添加点击事件 (闭包的应用)

    JS 循环li添加点击事件 (闭包的应用)

    这篇文章主要介绍了js循环li添加点击事件 (闭包的应用)的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-12-12
  • js实现按钮控制图片360度翻转特效的方法

    js实现按钮控制图片360度翻转特效的方法

    这篇文章主要介绍了js实现按钮控制图片360度翻转特效的方法,涉及HTML5中canvas方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-02-02
  • JS页面动态绘图工具SVG,Canvas,VML介简介

    JS页面动态绘图工具SVG,Canvas,VML介简介

    这篇文章主要介绍了JS页面动态绘图工具SVG,Canvas,VML介简介,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-10-10
  • uniapp时间格式化处理实现

    uniapp时间格式化处理实现

    本文主要介绍了uniapp时间格式化处理实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • JavaScript进阶知识点作用域详解

    JavaScript进阶知识点作用域详解

    这篇文章主要介绍了JavaScript进阶讲解一作用域,主要包括作用域、函数、闭包、面向对象、ES新特性、事件循环、微任务、宏任务、内存管理、Promise、await、 asnyc、防抖、节流等等知识点,需要的朋友可以参考下
    2022-05-05
  • JavaScript Event事件学习第一章 Event介绍

    JavaScript Event事件学习第一章 Event介绍

    Events是每一个JavaScript程序核心。什么是事件处理,它有什么问题和怎样写出跨浏览器的代码,我将在这一章做一个概述。我也会提供一些有精彩的关于事件处理程序的细节的文章。
    2010-02-02
  • 浅析javascript中函数声明和函数表达式的区别

    浅析javascript中函数声明和函数表达式的区别

    这篇文章主要介绍了浅析javascript中函数声明和函数表达式的区别,需要的朋友可以参考下
    2015-02-02

最新评论