1 $(
function(){
2 //1.计算总价和小计
3 productCount();
4 //2.实现全选复选框的选中功能
5 isCheckAll();
6 //3.设置子复选框是否全部选中
7 isChildCheckAll();
8 //4.1 给数量的减号添加点击事件
9 $(".cart_td_6").find("img[alt=minus]").click(
function(){
10 changeNumber(
this,
false);
11 });
12 //4.2.给数量的加号添加点击事件
13 $(".cart_td_6").find("img[alt=add]").click(
function(){
14 changeNumber(
this,
true);
15 });
16 //5.删除数据行
17 deleteData();
18 });
19 //5.删除数据行
20 function deleteData(){
21 //给"删除" 超链接生成点击事件
22 $(".cart_td_8").find("a").click(
function(){
23 //获取删除的前一行标题行
24 $(
this).parent().parent().prev().remove();
25 //删除数据行
26 $(
this).parent().parent().remove();
27 //1.计算总价和小计
28 productCount();
29 });
30
31 //给"删除所选"按钮生成点击事件
32 $("#deleteAll").click(
function(){
33 $("#shopping").find("tr[id]").each(
function(i,dom){
34 //获取子复选框的选中状态
35 var ischecked=$(dom).children(".cart_td_1").children().is(":checked"
);
36 if(ischecked){
37 //删除前一行标题行
38 $(dom).prev().remove();
39 //删除当前数据行
40 $(dom).remove();
41 }
42 });
43 //1.计算总价和小计
44 productCount();
45 });
46
47 }
48
49 //4.商品数量的增加和减少
50 function changeNumber(dom,flag){
51 //获取商品数量
52 var value=$(dom).parent().find("input"
).val();
53 //判断是累加和递减
54 if(flag){
55 value++
;
56 }
else{
57 value--
;
58 if(value<=0
){
59 value=1
;
60 alert("宝贝数量必须大于0"
);
61 }
62 }
63 //重新赋值
64 $(dom).parent().find("input"
).val(value);
65 //商品小计
66 productCount();
67 }
68
69 //3.设置子复选框是否全部选中
70 function isChildCheckAll(){
71 $(".cart_td_1").children().click(
function(){
72 //获取所有子复选框
73 var checkBoxs=$(".cart_td_1"
).children();
74 //获取所有子复选框的数量
75 var sum=
checkBoxs.size();
76 //定义选中复选框的个数
77 var k=0
;
78 //循环所有的子复选框,判断是否被选中,并统计选中数量
79 checkBoxs.each(
function(i,dom){
80 if($(dom).is(":checked"
)){
81 k++
;
82 }
83 });
84 //如果子复选框选中的个数,等于子复选框总数,则全选复选框被选中,否则全选不被选中
85 if(k==
sum){
86 $("#allCheckBox").attr("checked",
true);
87 }
else{
88 $("#allCheckBox").attr("checked",
false);
89 }
90 });
91 }
92
93
94 //2.实现全选复选框的选中功能
95 function isCheckAll(){
96 //给全选复选框添加点击事件
97 $("#allCheckBox").click(
function(){
98 //三目运算符,:checked如果选中返回true,否则返回false
99 var isChecked=$(
this).is(":checked"
);
100 //设置所有子复选框的选中状态和全选同步
101 $(".cart_td_1").children().attr("checked"
,isChecked);
102 });
103 }
104
105 //1.计算总价和小计
106 function productCount(){
107 //查找所有的数据行
108 //var $tr=$("#shopping tr[id]);
109 var $tr=$("#shopping").find("tr[id]"
);
110 //定义总价变量
111 var summer=0
;
112 //定义总积分变量
113 var integral=0
;
114 //循环所有的数据行计算价格和积分
115 $tr.each(
function(i,dom){
116 //获取商品数量
117 var num=$(dom).children(".cart_td_6").find("input"
).val();
118 //商品小计
119 var price=num*$(dom).children(".cart_td_5"
).text();
120 //在第七列小计列显示商品价格
121 $(dom).children(".cart_td_7"
).html(price);
122 //计算总价
123 summer+=
price;
124 //计算总积分
125 integral+=$(dom).children(".cart_td_4").text()*
num;
126
127 });
128 //显示总价格
129 $("#total"
).text(summer);
130 //显示总积分
131 $("#integral"
).text(integral);
132 }
转载于:https://www.cnblogs.com/holly8/p/8387895.html
相关资源:购物车实例