在做手机端二次开发购物车的时候,发现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. window7使用svn(svn系列 客户端 知识二总结)

     ♣eclipse插件subclipse  ♣TortoiseSVN  ♣svn操作  ♣注意事项 使用svn可以在eclipse直接装subclipse或者在windows使用TortoiseSVN ...

  2. 【Electron】Electron开发入门(七):打开本地文件或者网页链接 and webview里操纵electron api

    1.打开本地文件或者网页链接 // 打开系统本地文件 const {shell} = require('electron'); // Open a local file in the default ...

  3. C# 调用CMD执行命令行

    这几天用c#做了一个项目,其中一个功能是要把生成的临时文件隐藏,同时,不能在屏幕上有调用CMD的痕迹,这里生成的临时文件的绝对路径为delfile为文件的绝对路径, 代码如下: private voi ...

  4. VB中的GDI编程-2 画笔

    p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...

  5. 老李推荐:第6章1节《MonkeyRunner源码剖析》Monkey原理分析-事件源-事件源概览 2

    事件要到那里去? 每个事件源处理类都维护着一个自己的事件队列, 在Monkey中叫做CommandQueue,里面装的是每个具体的MonkeyEvent事件.当来自网络的字串命令被翻译成对应的Monk ...

  6. 大数据测试之hadoop系统生态

    poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标,也是国内最早探索大数据测试培训的机构,开发了独有的课程体系.如果对课程感兴趣,请大 ...

  7. 读Zepto源码之代码结构

    虽然最近工作中没有怎么用 zepto ,但是据说 zepto 的源码比较简单,而且网上的资料也比较多,所以我就挑了 zepto 下手,希望能为以后阅读其他框架的源码打下基础吧. 源码版本 本文阅读的源 ...

  8. [个人小工具]清除SVN控制

    SVN控制说白了就是在.svn文件夹内把项目文件的信息保存,清除SVN控制其实就是把.svn文件夹删除就可以了.但是如果文件夹太多,总不可能一个个文件夹去删除吧,所以写了个遍历文件夹删除的小工具. R ...

  9. Spring实战——缓存

    缓存 提到缓存,你能想到什么?一级缓存,二级缓存,web缓存,redis-- 你所能想到的各种包罗万象存在的打着缓存旗号存在的各种技术或者实现,无非都是宣扬缓存技术的优势就是快,无需反复查询等. 当然 ...

  10. 使用gulp编译sass

    之前写了一篇在ruby环境下如何编译sass的文章:<css预处理器sass使用教程(多图预警)>,随着现在前端构建工具的兴起,也学着使用这些工具来编译sass.webpack存在一个CS ...