美文网首页
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