网站地图    收藏   

主页 > 前端 > javascript >

js实现html Checkbox全选/不选效果

来源:自学PHP网    时间:2014-09-19 14:47 作者: 阅读:

[导读] Checkbox的中文名是复选框,下面我来利用js实现Checkbox全选/不选代码,有需要的朋友可参考。...

 代码如下 复制代码

<FORM onsubmit="return anyChecked()" method=post name=form1 action="">     
全选:<INPUT id=checkAll onclick=checkall() type=checkbox>     
多项选择框列表:     
<INPUT value=1 type=checkbox name=cb>     
<INPUT value=2 type=checkbox name=cb>     
<INPUT value=3 type=checkbox name=cb>     
<INPUT value=submit type=submit name=Submit>     
</FORM>    

js代码

<SCRIPT language=javaScript>     
   
//全选或全部不选     
function checkall() {     
    var isChecked=(document.form1.checkAll.checked == true);     
    var elements_all=document.form1.elements;     
    for(i=0;i<elements_all.length;i++) {     
        var element=elements_all[i];     
        if(element.type=="checkbox")  {     
            element.checked=isChecked;     
        }     
    }     
}     
   
//是否有checkbox被选中     
function anyChecked() {     
    var elements_any=document.form1.elements;     
    for(i=0;i<elements_any.length;i++) {     
        var element=elements_any[i];     
        if(element.checked == true) {     
            return true;     
        }     
    }     
    return false;     
}     
   
</SCRIPT>   

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论