zepto全选按钮之全选会根据按钮是否被全部选中更改状态
在做手机端二次开发购物车的时候,发现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全选按钮之全选会根据按钮是否被全部选中更改状态的更多相关文章
- js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false
用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...
- JS实现简单的多选选项的全选反选按钮
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <!-- 5 需求: 6 1.写三个按钮: ...
- js实现复选框的全选、全不选、反选
js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...
- react实现全选、取消全选和个别选择
react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...
- angular4 checkbox复选框的全选,反选及个别选择
<label><input type="checkbox" name="" [(ngModel)]="master"> ...
- JavaScript---复选框反选全选
Script <script type="text/javascript"> /*直接使用document.getElementsByName("c1&quo ...
- js全选与取消全选
实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...
- JQ实现购物车全选跟总计全选
//GoodsCheck购物车每个店铺的checkBox//goods-check购物车所有的checkBox//ShopCheck店铺全选的按钮//commlistFrm店铺商品的模块//allCh ...
- 让DuiLib CheckBox支持全选、全不选、非全选三种状态
原文 https://blog.csdn.net/EveyX/article/details/38433783 DuiLib官方库中的Checkbox只有Checked和Uncheck两种状态,但我们 ...
随机推荐
- python实现mysql的读写分离及负载均衡
Oracle数据库有其公司开发的配套rac来实现负载均衡,目前已知的最大节点数能到128个,但是其带来的维护成本无疑是很高的,并且rac的稳定性也并不是特别理想,尤其是节点很多的时候. 但是,相对my ...
- 服务器中 配置phpstudy一键安装包
在线phpstudy一键安装包 安装版: (很简单) wget -c http://lamp.phpstudy.net/phpstudy.bin chmod +x phpstudy.bin ...
- TensorFlow 安装详解
摘要: 原创出处:www.bysocket.com 泥瓦匠BYSocket 希望转载,保留摘要,谢谢! 『不要把手段当成目标 — <一个瑜伽行者的自传>』 本文提纲 1. 机器学习 2 ...
- LoadRunner性能测试专项班隆重开班
LoadRunner性能测试专项班隆重开班 POPTEST首届高级性能测试提升强化班开课. 也许你只是看到成功者的光鲜,却没看到他们的努力和汗水.不要否定现在,要看到未来.提高自己.怎么自己.成就自己 ...
- Redis基础学习(一)—Redis的安装
一.Redis的安装 1.在Linux环境下安装gcc环境 yum install gcc-c++ 2.解压缩Redis源码包 tar -zxf redis-3.0.0.tar.gz 3.编译 ...
- Linux服务器性能查看分析调优
一 linux服务器性能查看 1.1 cpu性能查看 1.查看物理cpu个数: cat /proc/cpuinfo |grep "physical id"|sort|uniq|wc ...
- sqlplus连接oracle问题
第一次在自己电脑上连接远端数据库,尝试了一上午居然还没成功,后来在网上找了一堆的方法终于是连接上了 -_-!! 总结一下:简单操作:一步到位 我主要是用的oracle 11g的数据库,sqlpl ...
- 关于下拉框列表不可选择相同值的设置一:当前DOM不可选
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- jwt token Example - Python
0 Pre Install Python3 Install PyCrypto Install PyJWT 1 token 由三部分组成 header, payload, sign 并用逗号连接各部分 ...
- 什么是PROFINET IO系统的实时性
实时系统是指系统能及时响应外部事件的请求,在规定的时间内完成对该事件的处理,并控制所有实时任务协调一致的运行. PROFINET IO系统的实时性就是指当有一个外部事件发生时,从输入信号到传输.到控制 ...