localStorage存值取值以及存取JSON,以及基于html5 localStorage的购物车

http://blog.csdn.net/u013267266/article/details/51530611

1. localStorage.setItem("key","value");//存储变量名为key，值为value的变量  
2.    
3. localStorage.key = "value"//存储变量名为key，值为value的变量  
4.    
5. localStorage.getItem("key");//获取存储的变量key的值www.it165.net  
6.    
7. localStorage.key;//获取存储的变量key的值  
8.    
9. localStorage.removeItem("key")//删除变量名为key的存储变量  

[javascript] view plain copy

 

 

 

 

1. //以上即为localStorage调用的方法。下面介绍存储JSON对象的方法。  
2. var students =   
3. {  
4.     liyang:{name:"liyang",age:17},  
5.   
6.     lilei:{name:"lilei",age:18}  
7.   
8. }//要存储的JSON对象  
9.   
10.   
11. students = JSON.stringify(students);//将JSON对象转化成字符串  
12.   
13. localStorage.setItem("students",students);//用localStorage保存转化好的的字符串  

[javascript] view plain copy

 

 

 

 

1. //上面即可保存JSON对象，接下来我们在要使用的时候再将存储好的students变量取回  
2.    
3. var students = localStorage.getItem("students");//取回students变量  
4.    
5. students = JSON.parse(students);//把字符串转换成JSON对象  
6.    
7. //以上即可得到存储的students的JSON对象了  

[javascript] view plain copy

 

 

 

 

1. utils = {  
2.     setParam : function (name,value){  
3.         localStorage.setItem(name,value)  
4.     },  
5.     getParam : function(name){  
6.         return localStorage.getItem(name)  
7.     }  
8. }  
9.   
10. product={  
11.     id:0,  
12.     name:"",  
13.     num:0,  
14.     price:0.00  
15. };  
16. orderdetail={  
17.     username:"",  
18.     phone:"",  
19.     address:"",  
20.     zipcode:"",  
21.     totalNumber:0,  
22.     totalAmount:0.00      
23. }  
24. cart = {  
25.     //向购物车中添加商品  
26.     addproduct: function (product) {  
27.         var ShoppingCart = utils.getParam("ShoppingCart");  
28.         if (ShoppingCart == null || ShoppingCart == "") {  
29.             //第一次加入商品  
30.             var jsonstr = { "productlist": [{ "id": product.id, "name": product.name, "num": product.num, "price": product.price}], "totalNumber": product.num, "totalAmount": (product.price * product.num) };  
31.             utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));  
32.         } else {  
33.             var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));  
34.             var productlist = jsonstr.productlist;  
35.             var result = false;  
36.             //查找购物车中是否有该商品  
37.             for (var i in productlist) {  
38.                 if (productlist[i].id == product.id) {  
39.                     productlist[i].num = parseInt(productlist[i].num) + parseInt(product.num);  
40.                     result = true;  
41.                 }  
42.             }  
43.             if (!result) {  
44.                 //没有该商品就直接加进去  
45.                 productlist.push({ "id": product.id, "name": product.name, "num": product.num, "price": product.price });  
46.             }  
47.             //重新计算总价  
48.             jsonstr.totalNumber = parseInt(jsonstr.totalNumber) + parseInt(product.num);  
49.             jsonstr.totalAmount = parseFloat(jsonstr.totalAmount) + (parseInt(product.num) * parseFloat(product.price));  
50.             orderdetail.totalNumber = jsonstr.totalNumber;  
51.             orderdetail.totalAmount = jsonstr.totalAmount;  
52.             //保存购物车  
53.             utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));  
54.         }  
55.     },  
56.     //修改给买商品数量  
57.     updateproductnum: function (id, num) {  
58.         var ShoppingCart = utils.getParam("ShoppingCart");  
59.         var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));  
60.         var productlist = jsonstr.productlist;  
61.   
62.         for (var i in productlist) {  
63.             if (productlist[i].id == id) {  
64.                 jsonstr.totalNumber = parseInt(jsonstr.totalNumber) + (parseInt(num) - parseInt(productlist[i].num));  
65.                 jsonstr.totalAmount = parseFloat(jsonstr.totalAmount) + ((parseInt(num) * parseFloat(productlist[i].price)) - parseInt(productlist[i].num) * parseFloat(productlist[i].price));  
66.                 productlist[i].num = parseInt(num);  
67.                 orderdetail.totalNumber = jsonstr.totalNumber;  
68.                 orderdetail.totalAmount = jsonstr.totalAmount;  
69.                 utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));  
70.                 return;  
71.             }  
72.         }  
73.     },  
74.     //获取购物车中的所有商品  
75.     getproductlist: function () {  
76.         var ShoppingCart = utils.getParam("ShoppingCart");  
77.         var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));  
78.         var productlist = jsonstr.productlist;  
79.         orderdetail.totalNumber = jsonstr.totalNumber;  
80.         orderdetail.totalAmount = jsonstr.totalAmount;  
81.         return productlist;  
82.     },  
83.     //判断购物车中是否存在商品  
84.     existproduct: function (id) {  
85.         var result = false;  
86.         var ShoppingCart = utils.getParam("ShoppingCart");  
87.         if (ShoppingCart != null) {  
88.             var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));  
89.             var productlist = jsonstr.productlist;  
90.             for (var i in productlist) {  
91.                 if (productlist[i].id == id) {  
92.                     result = true;  
93.                 }  
94.             }  
95.         }  
96.         return result;  
97.     },  
98.     //删除购物车中商品  
99.     deleteproduct: function (id) {  
100.         var ShoppingCart = utils.getParam("ShoppingCart");  
101.         var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));  
102.         var productlist = jsonstr.productlist;  
103.         var list = [];  
104.         for (var i in productlist) {  
105.             if (productlist[i].id == id) {  
106.                 jsonstr.totalNumber = parseInt(jsonstr.totalNumber) - parseInt(productlist[i].num);  
107.                 jsonstr.totalAmount = parseFloat(jsonstr.totalAmount) - parseInt(productlist[i].num) * parseFloat(productlist[i].price);  
108.             } else {  
109.                 list.push(productlist[i]);  
110.             }  
111.         }  
112.         jsonstr.productlist = list;  
113.         orderdetail.totalNumber = jsonstr.totalNumber;  
114.         orderdetail.totalAmount = jsonstr.totalAmount;  
115.         utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));  
116.     }  
117. };  

[javascript] view plain copy

 

 

 

 

1. //上面的基于html5 localStorage的购物车JS脚本使用方法  
2. var product =  
3. {  
4.     ‘id‘: id,        //属性名用引号括起来，属性间由逗号隔开  
5.     ‘name‘: ‘hhh‘,  
6.     ‘num‘:jq(‘#text-4‘).val(),  
7.     ‘price‘:199.9  
8. };  
9. //商品加入到购物车  
10. cart.addproduct(product);  
11. var productlist=cart.getproductlist();//取出购物车商品  
12. alert(‘‘, ‘商品:‘+productlist[0].id+‘ ‘+productlist[0].name+‘ ‘+productlist[0].num+‘ ‘+productlist[0].price, ‘确定‘);  

localStorage存值取值以及存取JSON,以及基于html5 localStorage的购物车

原文：http://www.cnblogs.com/zaifeng0108/p/7226438.html