您的位置：首页 > 其它

checkBox全选反选全不选

2017-04-08 08:34 148 查看

方法1

<script
language="javascript">

    function
selectIt() {


form = document.lzyy


action = event.srcElement.name


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


if (form.elements[i].name == "checkbox") {


e = form.elements[i]


e.checked = (action == "selectAll") ? (form.selectAll.checked) :
(!e.checked)


////在这里通过条件表达式?:来使每个框反选。朋友们可以好好思考一下。这种首先是一种实现方式。其二还能是代码简练。哈哈
反正个人是喜欢这种方式拉。


}


}

    }

</script>

<form name="lzyy">


<p class="STYLE1">


全选


<input type="checkbox" name="selectAll"
value="checkbox" onClick="selectIt()">


<br>


反选


<input type="checkbox" name="invest"
value="checkbox" onClick="selectIt()">


<br>


Item1


<input type="checkbox" name="checkbox"
value="checkbox">


<br>


Item2


<input type="checkbox" name="checkbox"
value="c
4000
heckbox">


<br>


Item3


<input type="checkbox" name="checkbox"
value="checkbox">


<br>


Item4


<input type="checkbox" name="checkbox"
value="checkbox">


<br>


Item5


<input type="checkbox" name="checkbox"
value="checkbox">


</p>

</form>

方法2

<html>




<head>


<script type="text/javascript">


function checkEvent(name, allCheckId) {


var allCk = document.getElementByIdx_x(allCheckId);


if (allCk.checked == true) checkAll(name);


else checkAllNo(name);


}


//全选


function checkAll(name) {


var names = document.getElementsByName(name);


var len = names.length;


if (len > 0) {


var i = 0;


for (i = 0; i < len; i++)


names[i].checked = true;


}


}


//全不选


function checkAllNo(name) {


var names = document.getElementsByName(name);


var len = names.length;


if (len > 0) {


var i = 0;


for (i = 0; i < len; i++)


names[i].checked = false;


}


}


//反选


function reserveCheck(name) {


var names = document.getElementsByName(name);


var len = names.length;


if (len > 0) {


var i = 0;


for (i = 0; i < len; i++) {


if (names[i].checked) names[i].checked = false;


else names[i].checked = true;


}


}


}


</script>


</head>




<body>


<input type="checkbox" id="ckall"
onclick="checkEvent('ck','ckall')" />


全选


<input type="checkbox" id="ckReserve"
onclick="reserveCheck('ck','ckReserve')"


/>


反选


<br />


<input type="checkbox" name="ck" value="1"
/>


篮球


<br />


<input type="checkbox" name="ck" value="2"
/>


旅游


<br />


<input type="checkbox" name="ck" value="3"
/>


读书


<br />


<input type="checkbox" name="ck" value="4"
/>


美食


<br />


<input type="checkbox" name="ck" value="5"
/>


睡觉


</body>

</html>

方法3

// 说明：Javascript 控制 CheckBox 的全选与取消全选

function checkAll(name) {

    var el =
document.getElementsByTagName_r('input');

    var len =
el.length;

    for (var i =
0; i < len; i++) {


if ((el[i].type == "checkbox") &&
(el[i].name == name)) {


el[i].checked = true;


}

    }

}

function clearAll(name) {

    var el =
document.getElementsByTagName_r('input');

    var len =
el.length;

    for (var i =
0; i < len; i++) {


if ((el[i].type == "checkbox") &&
(el[i].name == name)) {


el[i].checked = false;


}

    }

}

方法4

var checkFlag = true;　　　　

function ChooseAll() {

    if
(checkFlag) {　　　　　　　　


var inputs = document.all.tags("INPUT");　　　　　　　　


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


if (inputs[i].type == "checkbox" &&
inputs[i].id != "CheckAll") {


inputs[i].checked = true;　　　　　　　　　　


}　　　　　　　　


}


checkFlag = false;　　　　　　

    } else
{　　　　　　　　


var inputs = document.all.tags("INPUT");　　　　　　　　


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


if (inputs[i].type == "checkbox" &&
inputs[i].id != "CheckAll") {


inputs[i].checked = false;　　　　　　　　　　


}　　　　　　　　


}


checkFlag = true;　　　　　　

    }　　　　

}

方法5

<input type="button" name="" value="不计算长度"
onclick="a()">

<input type="button" name="" value="全选"
onclick="b()">

<input type="button" value="缓存"
onclick="c()">

<input type="checkbox" name="test[]"
value="0">

测试测试

<br>

<script language="JavaScript">






</script>

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

标签：

相关文章推荐

新的分享

章节导航