简易购物车

自己记性不好，做过的老是忘记，用的时候又去到处找，现在把自己不会的都记下来，方便日后查找。

1.cookie的名字

var COOKIE_PURCHASE = 'PURCHASE';

2.创建一个产品的类

function oldOrderList(){
         this.cp_number="";
         this.cp_name=""
　　　　　this.cp_gg="";
         this.cp_sale="";
         this.cp_shuliang=1;
         this.cp_jine="";
        }

3.点击选择添加到右边列表

 1 $(document).on("click", ".choicebutton", function() {
 2         //$.cookie(COOKIE_NAME, null, { path: '/' });  //删除cookie  
 3         var cp_number = $(this).attr("item-id"); //产品编号
 4         var cp_name = $("#row_" + cp_number + " .cp_name").html(); //产品名字
 5         var cp_gg = $("#row_" + cp_number + " .cp_gg").val(); //规格
 6         var cp_sale = $("#row_" + cp_number + " .cp_sale").html(); //成本价
 7         var cp_shuliang=1;  //数量
 8         var cp_jine=cp_sale; //总金额
 9         //创建一个新的实例
10         var order = new oldOrderList();
11         order.cp_number = cp_number;
12         order.cp_name = cp_name;
13         order.cp_gg = cp_gg;
14         order.cp_sale = cp_sale;
15         order.cp_shuliang=cp_shuliang;
16         order.cp_jine=cp_jine;
17         //获取cookie的值
18         var ck = $.cookie(COOKIE_PURCHASE);
19         var ckValue;
20         //判断cookie的值
21         if (ck !== undefined && ck !== "" && ck !== null) {
22             ckValue = $.parseJSON(ck);//序列化json格式
23             var p = 0;  
24             for (i in ckValue) {
25                 if (ckValue[i].cp_number == cp_number) {
26                     ckValue[i].cp_shuliang=ckValue[i].cp_shuliang + 1;  //如果点击了两次数量就加1
27                     $("#old_row_" + cp_number + " .cp_shuliang").val(ckValue[i].cp_shuliang);
28                     var jine = ckValue[i].cp_shuliang * ckValue[i].cp_sale;     //计算总价
29                      $("#old_row_" + cp_number + " .cp_jine").html(jine.toFixed(2));//显示出来，四舍五入
30                     ckValue[i].cp_jine = jine.toFixed(2);
31                     p = 1;
32                     break;
33                 } else {
34                     p = 0;
35                 }
36             }
37             if (p==0) {
38                 ckValue.push(order);
39             } else {
40                 
41             }
42         } else {
43             ckValue = [];
44             //添加
45              ckValue.push(order);
46         }
47         
48         //反序列化
49         var coSaveValue = JSON.stringify(ckValue);
50         //保存到cookie中
51         $.cookie(COOKIE_PURCHASE, coSaveValue, { path: '/', expires: 10 });
52 
53         if ($("#old_row_" + cp_number + "").length > 0) {
54 
55         } else {
56             $("#sale_list_tmpl").empty();
57             $("#finder-sale-list_tmp").tmpl(ckValue).appendTo("#sale_list_tmpl");
58         }
59     });

4.更改数量，当文本框失去焦点的时候就计算总金额，并保存到cookie

1 $(document).on("blur", ".cp_shuliang", function() {
 2         var cp_number = $(this).attr("item-id");
 3         var cp_shuliang = $(this).val();
 4         var ck = $.cookie(COOKIE_NAME);
 5         var ckValue = $.parseJSON(ck);
 6         for (i in ckValue) {
 7             if (ckValue[i].cp_number == cp_number) {
 8                 ckValue[i].cp_shuliang = cp_shuliang;
 9                 var jine = ckValue[i].cp_shuliang * ckValue[i].cp_sale;
10                 $("#old_row_" + cp_number + " .cp_jine").html(jine.toFixed(2));
11                 ckValue[i].cp_jine = jine.toFixed(2);
12                 //反序列化
13                 var coSaveValue = JSON.stringify(ckValue);
14                 //保存到cookie中
15                 $.cookie(COOKIE_NAME, coSaveValue, { path: '/', expires: 10 });
16             }
17         }
18     });

5.删除行

 1 $(document).on("click", ".btn-del-open", function() {
 2         var cp_number = $(this).attr("item-id");
 3         var ck = $.cookie(COOKIE_PURCHASE);
 4         var ckValue = $.parseJSON(ck);
 5         for (i in ckValue) {
 6             if (ckValue[i].cp_number == cp_number) {
 7                 ckValue.splice(i, 1);
 8                 //反序列化
 9                 var coSaveValue = JSON.stringify(ckValue);
10                 //保存到cookie中
11                 $.cookie(COOKIE_PURCHASE, coSaveValue, { path: '/', expires: 10 });
12             }
13         }
14         $("#old_row_" + cp_number + "").remove();
15     });