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两种状态,但我们 ...
随机推荐
- h5开发app之在线生成二维码
h5通过jquery和qrcode在线生成二维码 首先我们需要下载一个qrcode.js文件,然后依次引入jquery和qrcode文件. 1.创建一个输入框以便做演示使用: <input id ...
- spring security 3.x 多页面登录配置入门教程
最近在最shiro的多入口登录,搞了好久,就把spring security拿出来再炒一下,这是我以前在csdn写过的一篇博客. spring security 是一个权限控制的框架.可以很方便地实现 ...
- scrollWidth,offsetWidth,clientWidth,width;scrollHeight,offsetHeight,clientHeight,height;offsetTop,scrollTop,top;offsetLeft,scrollLeft,left还有谁
题中的那么多属性让人头都大了,他们到底是什么意思?不同浏览器的实现是一样的吗?以下所有结论来自chrome版本 53.0.2785.89 (64-bit)和firefox版本52.0.2,操作系统ub ...
- 漫谈PHP代码规范
前言 虽说PHP是世界上最好的语言,但是写出来的PHP代码却往往不是最美观的.究其原因,可能正式因为PHP简单易上手,适合快速迭代的特性,导致了我们沉浸在迅速完成需求迭代的窃喜中,却忘记了规范性.忽略 ...
- PHP中的for循环
循环 循环是操作某一个功能(执行某段代码). ①循环四要素: a 循环初始值 b 循环的条件 c 循环状态 d 循环体 ②for循环 a 穷举:把所有的可能性的都一一列出来. b 迭代:每次循环都会把 ...
- 36.java_exception_test
package mytext1; class TZException extends Exception{ TZException(String str){ super(str); } public ...
- app专项测试自动化测试方法思路与实现
秉着个人意愿打算把python+rf接口自动进行彻底结束再做些其它方面的输出~但事与愿违,但领导目前注重先把专项测试方面完成,借此,先暂停python+rf(主要是与Jenkins集成+导入DB+微信 ...
- MySQL之字符集-校对规则
一.字符集(Character set) 是多个字符(英文字符,汉字字符,或者其他国家语言字符)的集合,字符集种类较多,每个字符集包含的字符个数不同. 特点: ①字符编码方式是用一个或多个字节表示字符 ...
- 【卸载】oracle卸载
Oracle卸载比较麻烦,不能简单卸载就完成了,有时没有卸载完整,下次安装不能很好的安装: 当然Oracle卸载也没有那么难,只是步骤比较多.Oracle10g还是Oracle11g卸载步骤都是一样的 ...
- 关于Java中volatile关键字笔记
volatile通常被认为是一种轻量级的synchronized,字面上它表示易变的,在并发编程中,它保证了共享变量的可见性.所谓可见性指的是,某个线程对变量进行操作后,其他线程能够读取到操作后的最新 ...