Jquery-全选和取消的一个坑

在做一个商城的购物车的时候遇到了一个坑, 购物车一般都有全选按钮, 再次点击就会全部消除, 在网上查到的答案全部都是使用attr来做的, 无一例外都不能用, 之后才知道要使用jquery的prop和removeProp

关于attr和prop的区别

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>demo</title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
    <script>
        $(function(){
            isChecked = false;
            $('#all').click(function(){
                isChecked = !isChecked;
                if(isChecked){
                    $('.option').prop("checked",true)
                }else{
                    $('.option').removeProp("checked")
                }

            })
        })
    </script>
</head>
<body>
    <input type="checkbox" value="1" class="option">1</input>
    <br>
    <input type="checkbox" value="2" class="option">2</input>
    <br>
    <input type="checkbox" value="3" class="option">3</input>
    <br>
    <input type="checkbox" value="4" class="option">4</input>
    <br>
    <input type="checkbox" value="全选" id="all">全选</input>
</body>
</html>
posted @ 2016-11-03 19:28  qlshine  阅读(2107)  评论(0)  编辑  收藏  举报