在js中怎样获得checkbox里选中的多个值

一、在js中怎样获得checkbox里选中的多个值

1、举个例子，比如如下是HTML的结构：

2、这里推荐使用jQuery库，比较方便。以下是代码：

3、大致思路就是：先利用name属性值获取checkbox对象，然后循环判断checked属性。（true表示被选中，false表示未选中）

4、首先用document.getElementsByName()这个方法，通过input标签的name属性将input元素获取，并存进obj这个变量值中。然后建一个check_val的数组，通过for循环将input标签的value值存入数组中，这样就可以获取checkbox的选中的多个值。

5、Checkbox对象代表一个 HTML表单中的一个选择框。

6、在 HTML文档中<input type="checkbox">每出现一次，Checkbox对象就会被创建。

7、您可以通过遍历表单的 elements[]数组来访问某个选择框，或者通过使用 document.getElementById()。

8、参考资料：MDN—关于CheckBox属性

二、js 获取form中所有name相同的checkbox

声明是我复制粘贴来的（只要帮助你就好了）

通常采用JAVASCRIPT实现页面全选的，主要有下面三种情况：

1、当前页面中所有的CHECKBOX全部选中及取消。

2、当前页面中所有同名的CHECKBOX全部选中。

3、当前页面中所有具有相同前缀名的CHECKBOX全部选中。

这里以实例的形式，展示了三种情况的操作，完整源代码如下：

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>全选示例</title>

<form action="" method="post" name="loginForm">

/********************全选示例********************/<br>

<b>水果（checkbox同名）：</b><br>

<input type="checkbox" name="fruit" value="1">苹果<br>

<input type="checkbox" name="fruit" value="2">梨<br>

<input type="checkbox" name="fruit" value="3">桃<br>

<input type=button value="全选水果" onclick="checkAllFruit()">

<input type=button value="取消全选水果" onclick="unCheckAllFruit()"><br>

<b>蔬菜：</b><br>

<input type="checkbox" name="vegetable" value="4">大白菜<br>

<input type="checkbox" name="vegetable" value="5">西红柿<br>

<b>水果2（checkbox不同名，具有相同的前缀名）：</b><br>

<input type="checkbox" name="_fruit1" value="6">苹果<br>

<input type="checkbox" name="_fruit2" value="7">梨<br>

<input type="checkbox" name="_fruit3" value="8">桃<br>

<input type=button value="全选水果2" onclick="checkAllFruit2()">

<input type=button value="取消全选水果2" onclick="unCheckAllFruit2()"><br>

<input type="checkbox" name="vegetable" onclick="doChangeCheckStatus(this);">全选

<input type=button value="所有全选" onclick="checkAll()">

<input type=button value="取消所有全选" onclick="unCheckAll()">

<Script language="JavaScript">...

var objs= document.getElementsByTagName("input");

for(var i=0; i<objs.length; i++)...{

if(objs[i].type.toLowerCase()=="checkbox")

var objs= document.getElementsByTagName("input");

for(var i=0; i<objs.length; i++)...{

if(objs[i].type.toLowerCase()=="checkbox")

if(objs[i].name.toLowerCase()=="fruit")

var objs= document.getElementsByTagName("input");

for(var i=0; i<objs.length; i++)...{

if(objs[i].type.toLowerCase()=="checkbox")

if(objs[i].name.toLowerCase().substring(0,6)=="_fruit")

var objs= document.getElementsByTagName("input");

for(var i=0; i<objs.length; i++)...{

if(objs[i].type.toLowerCase()=="checkbox")

var objs= document.getElementsByTagName("input");

for(var i=0; i<objs.length; i++)...{

if(objs[i].type.toLowerCase()=="checkbox")

if(objs[i].name.toLowerCase()=="fruit")

var objs= document.getElementsByTagName("input");

for(var i=0; i<objs.length; i++)...{

if(objs[i].type.toLowerCase()=="checkbox")

if(objs[i].name.toLowerCase().substring(0,6)=="_fruit")

function doChangeCheckStatus(obj)

三、求javascript checkbox 选中事件代码

首先通过getElementById或其它方式获得这些对象obj，然后判断obj.checked= true或false就可以了。

<input id='bigclassauthorize' type='checkbox' onclick='testClickBigCheckBox()'/>

<input id='smallclassauthorize1' type='checkbox'/>

<input id='smallclassauthorize2' type='checkbox'/>

function testClickBigCheckBox(){

var big= document.getElementById('bigclassauthorize');

var small1= document.getElementById('smallclassauthorize1');

var small2= document.getElementById('smallclassauthorize2');

代码可以精简或者封装,这里只是简单的描述一下基本做法，以上是大项被选中的事件处理，小项的原理差不多。

思路：获取checkbox对象，根据value属性设置checkbox的checked属性（true为选中，false为取消选中）。下面实例演示——根据文本框的制定值设置复选框的选中项：

<input name="test" type="checkbox" value="1"/>item-1

<input name="test" type="checkbox" value="2"/>item-2

<input name="test" type="checkbox" value="3"/>item-3<br>

<input name="test" type="checkbox" value="4"/>item-4

<input name="test" type="checkbox" value="5"/>item-5<br>

<input type="text" id="val"><input type="button" value="确定" onclick="fun()">

var val= document.getElementById("val").value.split(",");

var boxes= document.getElementsByName("test");

for(i=0;i<boxes.length;i++){