码迷,mamicode.com
首页 > Web开发 > 详细

jquery实现购物车的全选与反选

时间:2019-09-03 12:06:02      阅读:136      评论:0      收藏:0      [点我收藏+]

标签:jquer   his   ==   func   checked   mamicode   图片   this   一个   

//获取所有的子按钮让下面的去全选按钮跟着改变
var inputs=$(‘.Item‘)
var allinput=$(‘.qxan‘)
$(".Item").click(function () {
var s = $(".Item").length;
var a = $(".Item:checked").length;
if (s == a) {
allinput.prop(‘checked‘, true);
} else {
allinput.prop(‘checked‘, false);
}
});

// 点击每一家中的商品或者店名前面的的input框时,让里面额input框也跟着改变  如下图
$(‘.diangdan‘).on(‘tap‘,‘input‘,function(){
if(this.checked){
$(this).parent().parent().siblings().children().children(‘input‘).prop("checked",false);
}else {
$(this).parent().parent().siblings().children().children(‘input‘).prop("checked", true);
}
})

//点击全选事件
$(‘.qxan‘).on(‘tap‘,function(){
if(this.checked){
$(‘.Item‘).prop("checked",false);
}else {
$(‘.Item‘).prop("checked", true);
}

})

 

技术图片

补充说明:

中间的功能是自己按照实际的需求自己进行修改的

前两个按钮是一家店铺,并在里面所购买一种商品

最后一个为全选按钮

 

jquery实现购物车的全选与反选

标签:jquer   his   ==   func   checked   mamicode   图片   this   一个   

原文地址:https://www.cnblogs.com/Progress-/p/11451711.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!