js层级checkbox,js层级对象遍历

本文目录一览：

• 1、如何用js 给checkbox
• 2、js如何实现复选框的多级联动
• 3、js中怎么获取checkbox选中的值

如何用js 给checkbox

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

1、HTML结构

1

2

3

4

5

6

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

input name=”test” type=”checkbox” value=”4″ /item-4

input name=”test” type=”checkbox” value=”5″ /item-5

input type=”text” id=”val”input type=”button” value=”确定” onclick=”fun()”

2、javascript代码

1

2

3

4

5

6

7

8

9

10

11

12

function fun(){

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

var boxes = document.getElementsByName(“test”);

for(i=0;iboxes.length;i++){

for(j=0;jval.length;j++){

if(boxes[i].value == val[j]){

boxes[i].checked = true;

break

}

}

}

}

3、效果演示

js如何实现复选框的多级联动

1、为 复选框的 onclick 事件 绑定js 方法

2、在 js 方法中，判断复选框当前值

2.1、如果选中，将关联的复选框也选中

2.2、如果没有选中，将关联的复选框取消选中

js中怎么获取checkbox选中的值

js中获取checkbox选中的值的方法：

script

function checkbox()

{

var str=document.getElementsByName(“box”);

var objarray=str.length;

var chestr=””;

for (i=0;iobjarray;i++)

{

if(str[i].checked == true)

{

chestr+=str[i].value+”,”;

}

}

if(chestr == “”)

{

alert(“请先选择一个爱好”);

}

else

{

alert(“先择的是：”+chestr);

}

}

/script

选择爱好：

input type=”checkbox” name=”box” id=”box1″ value=”跳水” /跳水

input type=”checkbox” name=”box” id=”box2″ value=”跑步” /跑步

input type=”checkbox” name=”box” id=”box3″ value=”听音乐” /听音乐

input type=”button” name=”button” id=”button” onclick=”checkbox()” value=”提交” /