百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>JS教程> js实现html Checkbox全选/不选效果
分享文章到:

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

发布时间:01/15 来源: 浏览: 关键词:
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>   

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有4人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板