您的位置：首页 > Web前端 > JavaScript

Javascript实现复选框(全选反选功能)

2011-03-15 19:52 716 查看

在一个项目开发中我们经常见到页面会有复选框的全选和反选功能，这样我们才能够进行下一步的批量删除或者实现其他的功能，那我们应该怎样去实现这样的一个功能呢？其实想要实现复选框的全选和反选功能很简单只要得到复选框的集合判断一下就可以了。
代码实现如下:

Java代码

<body>

<div>

<input type="checkbox" name="cxb" value="游戏" />游戏

<input type="checkbox" name="cxb" value="吃饭" />吃饭

<input type="checkbox" name="cxb" value="唱歌" />唱歌

<input type="checkbox" name="cxb" value="跳舞" />跳舞

<input type="checkbox" name="cxb" value="休息" />休息

<input type="checkbox" name="cxb" value="学习" />学习

<input type="button" value="全选" onclick="select1(1)"/>//注意select是关键字不能写

<input type="button" value="反选" onclick="select1(-1)"/>

<input type="button" value="取消" onclick="select1(0)"/>

</div>

</body>

<script type="text/javascript">

function select1(oper){

//alert("11");

var arr=document.getElementsByName("cxb");//得到集合

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

switch(oper){//没有break就继续执行知道遇到break跳出

case 0:

case 1:

arr[i].checked=oper;

break;

case -1:

arr[i].checked=!arr[i].checked;

break;

}

}

}

</script>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航