在做手机端二次开发购物车的时候,发现zepto全选,没找到,或者功能不是自己想要的

  后来做好,分享给需要的人

//全选或多选处理 
    var CheckAll = $('#items_check_all');
    var checkbox = $('input[name^="check"]');
    var removeUrl = '<{link app=b2c ctl=wap_cart act=remove}>';
    
    //初始化,把所有选中的加上状态
    if (CheckAll && checkbox) {
        $('.pt-h-item').addClass('active').css('background','#efefef');
    }
    
    //全选或全不选
    CheckAll.on("click",function(){
        if (this.checked){
            checkbox.prop('checked',true);
            //$('.pt-h-item').addClass('active').css('background','#efefef');
        }else{            
            checkbox.prop('checked',false);
            //$('.pt-h-item').removeClass('active').css('background','#fff');    
        }
    });
    
    //单选后反向关联全选按钮
    checkbox.on("click",function(){    
        var flag = true;
        checkbox.each(function(item){
            var parent = $(this).parents('.pt-h-item');
            if (!this.checked) {
                flag = false;
                parent.removeClass('active').css('background','#fff');
            }else{
                parent.addClass('active').css('background','#efefef');
            }
        })
        if (flag) {
            CheckAll.prop('checked', true);            
        }else{
            CheckAll.prop('checked', false);            
        }
    });

zepto全选按钮之全选会根据按钮是否被全部选中更改状态的更多相关文章

  1. js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false

    用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...

  2. JS实现简单的多选选项的全选反选按钮

    1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <!-- 5 需求: 6 1.写三个按钮: ...

  3. js实现复选框的全选、全不选、反选

    js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...

  4. react实现全选、取消全选和个别选择

    react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...

  5. angular4 checkbox复选框的全选,反选及个别选择

    <label><input type="checkbox" name="" [(ngModel)]="master"> ...

  6. JavaScript---复选框反选全选

    Script <script type="text/javascript"> /*直接使用document.getElementsByName("c1&quo ...

  7. js全选与取消全选

    实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...

  8. JQ实现购物车全选跟总计全选

    //GoodsCheck购物车每个店铺的checkBox//goods-check购物车所有的checkBox//ShopCheck店铺全选的按钮//commlistFrm店铺商品的模块//allCh ...

  9. 让DuiLib CheckBox支持全选、全不选、非全选三种状态

    原文 https://blog.csdn.net/EveyX/article/details/38433783 DuiLib官方库中的Checkbox只有Checked和Uncheck两种状态,但我们 ...

随机推荐

  1. hiveF 函数解析时间问题

    #!/bin/bashsource /etc/profileupdatetime=`date --date='0 days ago' +"%Y-%m-%d %H:%M:%S"`ec ...

  2. Android自定义ListView的Item无法响应OnItemClick的解决办法(转)

    原文链接:http://www.linuxidc.com/Linux/2011-09/43205.htm 如果你的自定义ListViewItem中有Button或者Checkable的子类控件的话,那 ...

  3. PHP对象相关知识点的总结

    对象传递:一种说法是"PHP对象是通过引用传递的",更准确的说法是别名(标识符)传递,即它们都保存着同一个标识符(ID)的拷贝,这个标识符指向同一个对象的真正内容. <?ph ...

  4. mysql 分析5语句的优化--索引添加删除

    查看表的索引  show create table 表名; show index from 表名; show keys from表名; 添加索引 alter table 表名  add index 索 ...

  5. python executemany的使用

    使用executemany对数据进行批量插入的话,要注意一下事项: #coding:utf8 conn = MySQLdb.connect(host = "localhost", ...

  6. iOS图片填充UIImageView(contentMode)

    本文主要形象的介绍一下UIView的contentMode属性: 核心代码 [self.prp_imageView setContentMode:UIViewContentModeScaleAspec ...

  7. ios 获取当前ViewController

    - (UIViewController*)getpresentVC:(UIWindow *)window{ if ([window.rootViewController class]==[UITabB ...

  8. 如何通过Mysql的二进制日志恢复数据库数据

    经常有网站管理员因为各种原因和操作,导致网站数据误删,而且又没有做网站备份,结果不知所措,甚至给网站运营和盈利带来负面影响.所以本文我们将和大家一起分享学习下如何通过Mysql的二机制日志(binlo ...

  9. select 训练

    --1.查询"c001"课程比"c002"课程成绩高的所有学生的学号:SELECT b.sno FROM (SELECT * FROM sc WHERE cno ...

  10. MySQL Online DDL的改进与应用

        本文简析Online DDL的实现原理与使用过程注意事项.       任何DDL操作,执行者都需要预先测试或者清晰了解这个操作会给数据库带来的影响是否是在业务期间数据库的可承受范围内,尤其是 ...