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