JS+JSP checkBox 全选具体实现
更新时间:2014年01月02日 17:26:33 作者:
本文为大家介绍下使用JS+JSP实现checkBox全选,下面有个不错的示例,感兴趣的朋友可以参考下
复制代码 代码如下:
<script>
function func(){
var options=document.getElementsByName("chkBox");
for (var i=0;i<options.length;i++){
if(!options[i].disabled){
options[i].checked=true;
}
}
}
</script>
<input type=checkbox name=chkBox value=1 disabled>
<input type=checkbox name=chkBox value=1>
<input type=checkbox name=chkBox value=1>
<input type=checkbox name=chkBox value=1>
<input type=button value="测 试" onclick="func()">
用javascript吧。
复制代码 代码如下:
<html>
<body>
<script>
function kk(){
var handleEl = document.getElementById("kkHandler");
var els = document.getElementsByName("kk");
for(i=0;i<els.length;i++){
els[i].checked = handleEl.checked;
}
}
</script>
<input type=checkbox onclick="kk()" name="kkHandler">全选<br>
<input type=checkbox name="kk">
<input type=checkbox name="kk">
</body>
</html>
2:
复制代码 代码如下:
<form name="form" ID="Form1">
<input type="checkbox" name="id" value="" ID="Checkbox1">1
<input type="checkbox" name="id" value="" ID="Checkbox2">2
<input type="checkbox" name="chose" value="" onclick="selectAll()" ID="Checkbox5">allselect
</form>
<script>
function selectAll()
{
if(!document.form.id.length){
if(document.form.chose.checked){
document.form.id.checked=true;
}
else{
document.form.id.checked=false;
}
}
else{
for(var i=0;i<document.form.id.length;i++){
if(document.form.chose.checked){
document.form.id[i].checked=true;
}
else{
document.form.id[i].checked=false;
}
}
}
}
</script>
3:
复制代码 代码如下:
<input type='checkbox' name='info' value='a'>
<input type='checkbox' name='info' value='b'>
<input type='checkbox' name='info' value='c'>
<input type='checkbox' name='info' value='d'>
<input type='checkbox' name='info' value='e'><br>
<input type='button' value =' 全选 'onclick='check_all();'>
<script>
function check_all(){
arr = document.getElementsByName('info');
for(i=0;i<arr.length;i++){
arr[i].checked = true;
}
}
</script>
相关文章
javascript简单实现跟随滚动条漂浮的返回顶部按钮效果
这篇文章主要介绍了javascript简单实现跟随滚动条漂浮的返回顶部按钮效果,涉及javascript基于onscroll事件动态改变页面元素样式的相关技巧,需要的朋友可以参考下2016-08-08Radio 单选JS动态添加的选项onchange事件无效的解决方法
radio 单选JS动态添加的选项,onchange事件无效。使用delegate()函数可以解决该问题,具体解决方案大家通过本文详细了解下2016-12-12
最新评论