美文网首页
jquery-全选

jquery-全选

作者: 一名有马甲线的程序媛 | 来源:发表于2017-11-29 17:44 被阅读0次

    html:

        <input type="checkbox" class="input">选项1  
        <input type="checkbox" class="input">选项2  
        <input type="checkbox" class="input">选项3  
        <input type="checkbox" class="input">选项4  
        <input type="checkbox" class="input">选项5  
        <br>  
        <input type="checkbox" class="all">全选  
    

    js:

        $(".all").click(function () {
            $(".input").prop("checked",this.checked);
        })
    
        $(".input").change(function(){
            var bian = true;
            $(".input").each(function(){ 
                if( $(this).prop("checked") ){
                    $(".all").prop("checked",false)
                }else{
                    bian = false;
                }
            })
    
            if(bian){
                $(".all").prop("checked",true)
            }
        });
    

    相关文章

      网友评论

          本文标题:jquery-全选

          本文链接:https://www.haomeiwen.com/subject/agdpbxtx.html