js中如何实现多个复选框全选

JavaScript06

js中如何实现多个复选框全选,第1张

CheckBox复选框JS实现全选全不选功能,很简单,就只需插入一小段js函数就行了。。。

<script language="javascript">

  function cli(Obj)

  {

  //获取控制其它复选框的对象obj

  var collid = document.getElementByIdx_x("all")

  //获取需要全选,全不选功能的所有复选框

  var coll = document.getElementsByName(Obj)

  //如果obj被选中,则全选

  if (collid.checked){

     //循环设置所有复选框为选中状态

     for(var i = 0 i < coll.length i++)

       coll[i].checked = true

  }else{//取消obj选中状态,则全不选

     //循环设置所有复选框为未选中状态

     for(var i = 0 i < coll.length i++)

       coll[i].checked = false

  }

  }

  </script>

----------------------------------------------------

下面是一组CheckBox复选框html代码

----------------------------------------------------

<input name='多选项名称' type='checkbox' value='' id="all"  onclick="cli('多选项名称')">  全选

<input name='多选项名称' type='checkbox' value='' >  A

<input name='多选项名称' type='checkbox' value='' >  B

<input name='多选项名称' type='checkbox' value='' >  C

<input name='多选项名称' type='checkbox' value='' >  D

<input name='多选项名称' type='checkbox' value='' >  E

<input name='多选项名称' type='checkbox' value='' >  F

----------------------------------------------------

<!DOCTYPE html>

<html>

<head>

<title></title>

</head>

<body>

<div>文本框:</div>

<textarea>按下ESC选中我</textarea>

<script src="jquery.min.js" ></script>

<script type="text/javascript">

function hotkey()

{

var a=window.event.keyCode

if(a==27)

{

$('textarea').select()

}

}

// 初始化加载

$(document).ready(function () {

document.onkeydown = hotkey

})

</script>

</body>

</html>

$("#all").click(function(){

if(this.checked){

$("input[type='checkbox']").attr("checked", true)

}else{

$("input[type='checkbox").attr("checked", false)

}

})

全选按钮的ID为“all”