在做手机端二次开发购物车的时候,发现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. Azure Messaging-ServiceBus Messaging消息队列技术系列7-消息事务

    上篇博文中我们介绍了Azure Messaging-ServiceBus Messaging消息回执机制. Azure Messaging-ServiceBus Messaging消息回执机制 本文中 ...

  2. Unity 3D Framework Designing(7)——IoC工厂理念先行

    一谈到 『IoC』,有经验的程序员马上会联想到控制反转,将创建对象的责任反转给工厂.IoC是依赖注入 『DI』 的核心,大名鼎鼎的Spring框架就是一个非常卓越的的控制反转.依赖注入框架.遗憾的是, ...

  3. java如何停止一个运行的线程?

    关于线程的一点心得 //首先导入需要的包 improt java.util.Timer;import java.io.File;import java.util.TimerTask; //首先需要创建 ...

  4. 性能调优之MYSQL高并发优化下

    三.算法的优化 尽量避免使用游标,因为游标的效率较差,如果游标操作的数据超过1万行,那么就应该考虑改写..使用基于游标的方法或临时表方法之前,应先寻找基于集的解决方案来解决问题,基于集的方法通常更有效 ...

  5. html实现 页面禁止右键 禁止复制 禁止图片拖动 禁止复制和剪切

    众所周知,一般的屏蔽的方法是用JS来编写的脚本,但是也可以直接通过修改网页属性的方法来屏蔽右键 禁止复制. 禁止右键 oncontextmenu="return false" 禁止 ...

  6. 《Python基础教程》第1章读书笔记

    # -*- coding:utf-8 -*- x = "hello " y = "world" print x+y print "hello &quo ...

  7. 浩哥解析MyBatis源码(十)——Type类型模块之类型处理器

    原创作品,可以转载,但是请标注出处地址:http://www.cnblogs.com/V1haoge/p/6715063.html 1.回顾 之前的两篇分别解析了类型别名注册器和类型处理器注册器,此二 ...

  8. vue2 与后台信息交互

    vue-resource  是vue的ajax请求插件 vue-resource文档:https://github.com/vuejs/vue-resource/blob/master/docs/ht ...

  9. JSSDK微信自定义分享

    背景:15年之前的微信分享只需要加入一段js就可以实现.后来微信官方全部禁止了.现在的微信分享全部得使用jssdk. 一.分享功能: 在微信内(必须在微信里)打开网站页面,分享给朋友或者分享到朋友圈时 ...

  10. 光场相机重聚焦之二——Lytro Illum记录光场

    上一节中大概讲述了光场相机和光场的参数化表示,这一节就说一下光场相机内部是如何记录光场以及实现重聚焦的. 博主用的是Lytro Illum,所以就以Illum为例来说了,Illum的功能还是挺多的,上 ...