jquery实现全选效果-亲测可用

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script type="text/javascript">
        function allof() {
            $("input").prop("checked",true);
        }
        function allnot() {
            $("input").prop("checked",false);
        }
        function other() {
            $("input[name='hobby']").each(function(){
                $(this).prop("checked",$(this).prop("checked")?false:true);
            });
        }
    </script>
</head>
<body>
    <input type="checkbox" name="hobby" value="a"> A <hr>
    <input type="checkbox" name="hobby" value="b"> B <hr>
    <input type="checkbox" name="hobby" value="c"> C <hr>
    <input type="checkbox" name="hobby" value="d"> D <hr>
    <input type="checkbox" name="hobby" value="e"> E <hr>
    <input type="checkbox" name="hobby" value="f"> F <hr>
    <button onclick="allof()">全选</button>
    <button onclick="other()">反选</button>
    <button onclick="allnot()">全不选</button>
</body>
</html>
posted @ 2022-03-11 16:56  IT_农民  阅读(113)  评论(0编辑  收藏  举报