js中复选框怎么做全选 但是不全部选中
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js中复选框怎么做全选 但是不全部选中相关的知识,希望对你有一定的参考价值。
参考技术A 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
----------------------------------------------------
js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false
用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中。
详解:
有两种方式使<input type="checkbox" />中的复选框被选中。
方法一:直接在HTML行间中添加checked属性。 eg:<input type="checkbox" checked />
方法二:使用javascript使input对象的checked="true"; eg: document.getElementsByTagName(‘input‘)[0].checked=‘true‘;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>全选</title> <script> window.onload = function(){ var aInput = document.getElementsByTagName(‘input‘); var oInput = aInput[0]; var a = 0; var b = 0; aInput[0].onclick = function(){ for (var i = 0; i < aInput.length; i++) { if(aInput[0].checked == true){ aInput[i].checked = true; }else{ aInput[i].checked = false; } } }; for (var i = 1; i < aInput.length; i++) { aInput[i].onclick = function(){ a = 0; b = 0; for (var i = 1; i < aInput.length; i++) { if (aInput[i].checked == false) { a++; }else { b++; } } if(a>0){ oInput.checked = false; }else if(b==aInput.length-1){ oInput.checked = true; }; }; } }; </script> </head> <body> <p><input type="checkbox" name="" />全选</p> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> <input type="checkbox" name="" /><br /> </body> </html>
以上是关于js中复选框怎么做全选 但是不全部选中的主要内容,如果未能解决你的问题,请参考以下文章