快捷导航
查看: 758|回复: 7

[求助] 单选全选的案例哪位大神有呢??

[复制链接]
发表于 2016-9-21 08:54:49 | 显示全部楼层 |阅读模式
单选,全选的案例,不要是input标签写的! 像图片这种案例,哪位大神可以给个demo!
demo921085311.png
发表于 2016-9-21 08:57:41 | 显示全部楼层
这样的案例这里很多啊
这个单选按钮应该是复选框吧,应该是模拟实现的
发表于 2016-9-21 09:54:24 | 显示全部楼层
如果需要我可以帮你写一个这样的复选框
 楼主| 发表于 2016-9-21 10:43:15 | 显示全部楼层
没有最好 发表于 2016-9-21 09:54
如果需要我可以帮你写一个这样的复选框

我已经模拟了一个,就是有点bug!  每次全选的时候,取消全选 ! 然后单选的时候,要点击两次 才能单选!  还有当我点击了所有的单选按钮,全选的按钮不会勾选上!

<script>
    $(function () {
        var checkcart = $('.jbCartItems .checkcart');
        var checkall = $('.Totalcost .checkcart');
        var onoff = true;
        checkcart.each(function (index) {
            checkcart[index].onoff = true;
            $(this).click(function () {
                //       console.log(checkcart[index]);
                console.log(onoff);
                if (this.onoff == true) {
                    $(this).addClass('actived');
                    this.onoff = false;
                } else {
                    $(this).removeClass('actived');
                    this.onoff = true;
                    checkf();
                }
                return false;
            })
               })
        checkall.click(function () {
            if (onoff) {
                $(this).addClass('actived');
                checkcart.addClass('actived')
                allcheck();
                onoff = false;
            } else {
                if (!$('.jbCartItems .checkcart').hasClass('actived')) {
                    $(this).removeClass('actived');
                }
                $(this).removeClass('actived');
                checkcart.removeClass('actived');
             //   console.log(onoff);
                  onoff = true;

            }
            return false;
         })
        function checkf() {
            onoff = true;
            checkall.removeClass('actived');
        };
        function allcheck() {
            for (var i = 0; i < checkcart.length; i++) {
                checkcart.onoff = false;
            }
        };
     })
</script>

geekbuying21103836.png
geekcode3943.png
发表于 2016-9-21 10:52:41 | 显示全部楼层
中午吃饭的时候帮你看看代码
 楼主| 发表于 2016-9-21 11:06:53 | 显示全部楼层
caicai 发表于 2016-9-21 10:52
中午吃饭的时候帮你看看代码

好的 ! 麻烦了 谢谢!
发表于 2016-9-21 13:48:17 | 显示全部楼层
deveil 发表于 2016-9-21 11:06
好的 ! 麻烦了 谢谢!

能不能发一个压缩包出来
这么看我只能猜测,好难的感觉
 楼主| 发表于 2016-9-21 13:57:39 | 显示全部楼层
caicai 发表于 2016-9-21 13:48
能不能发一个压缩包出来
这么看我只能猜测,好难的感觉

你那边看下吧!

发表回复

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于我们|手机版|小黑屋| ( 鲁ICP备10022556号-3 )

GMT+8, 2017-8-21 12:45 , Processed in 0.084218 second(s), 21 queries .

Powered by Discuz! X3.2 Licensed

Copyright © 2012-2017 Design: 蚂蚁部落

快速回复返回顶部 返回列表