美文网首页
用jq写全选、反选和不选

用jq写全选、反选和不选

作者: lucky_yao | 来源:发表于2020-10-23 07:49 被阅读0次
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title></title>
        </head>
        <body>
            <input type="checkbox" name="" id="" value="" />
            <input type="checkbox" name="" id="" value="" />
            <input type="checkbox" name="" id="" value="" />
            <input type="checkbox" name="" id="" value="" />
            <input type="checkbox" name="" id="" value="" />
            <button type="button">全选</button>
            <button type="button">不选</button>
            <button type="button">反选</button>
        </body>
        <script src="../../js/jquery-1.10.1.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            $('button').eq(0).click(function(){
                $('input').each(function(a){
                    $('input').eq(a).prop('checked', true)
                })
            })
            $('button').eq(1).click(function(){
                $('input').each(function(a){
                    $('input').eq(a).prop('checked', false)
                })
            })
            $('button').eq(2).click(function(){
                $('input').each(function(){
                    this.checked = !this.checked
                })
            })
        </script>
    </html>
    

    相关文章

      网友评论

          本文标题:用jq写全选、反选和不选

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