localStorage存值取值以及存取JSON,以及基於html5 localStorage的購物車
阿新 • • 發佈:2017-07-24
_for 獲取 substr 查找 nbsp assets tlist for tps
http://blog.csdn.net/u013267266/article/details/51530611
- localStorage.setItem("key","value");//存儲變量名為key,值為value的變量
- localStorage.key = "value"//存儲變量名為key,值為value的變量
- localStorage.getItem("key");//獲取存儲的變量key的值www.it165.net
- localStorage.key;//獲取存儲的變量key的值
- localStorage.removeItem("key")//刪除變量名為key的存儲變量
- //以上即為localStorage調用的方法。下面介紹存儲JSON對象的方法。
- var students =
- {
- liyang:{name:"liyang",age:17},
- lilei:{name:"lilei",age:18}
- }//要存儲的JSON對象
- students = JSON.stringify(students);//將JSON對象轉化成字符串
- localStorage.setItem("students",students);//用localStorage保存轉化好的的字符串
- //上面即可保存JSON對象,接下來我們在要使用的時候再將存儲好的students變量取回
- var students = localStorage.getItem("students");//取回students變量
- students = JSON.parse(students);//把字符串轉換成JSON對象
- //以上即可得到存儲的students的JSON對象了
- utils = {
- setParam : function (name,value){
- localStorage.setItem(name,value)
- },
- getParam : function(name){
- return localStorage.getItem(name)
- }
- }
- product={
- id:0,
- name:"",
- num:0,
- price:0.00
- };
- orderdetail={
- username:"",
- phone:"",
- address:"",
- zipcode:"",
- totalNumber:0,
- totalAmount:0.00
- }
- cart = {
- //向購物車中添加商品
- addproduct: function (product) {
- var ShoppingCart = utils.getParam("ShoppingCart");
- if (ShoppingCart == null || ShoppingCart == "") {
- //第一次加入商品
- var jsonstr = { "productlist": [{ "id": product.id, "name": product.name, "num": product.num, "price": product.price}], "totalNumber": product.num, "totalAmount": (product.price * product.num) };
- utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));
- } else {
- var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));
- var productlist = jsonstr.productlist;
- var result = false;
- //查找購物車中是否有該商品
- for (var i in productlist) {
- if (productlist[i].id == product.id) {
- productlist[i].num = parseInt(productlist[i].num) + parseInt(product.num);
- result = true;
- }
- }
- if (!result) {
- //沒有該商品就直接加進去
- productlist.push({ "id": product.id, "name": product.name, "num": product.num, "price": product.price });
- }
- //重新計算總價
- jsonstr.totalNumber = parseInt(jsonstr.totalNumber) + parseInt(product.num);
- jsonstr.totalAmount = parseFloat(jsonstr.totalAmount) + (parseInt(product.num) * parseFloat(product.price));
- orderdetail.totalNumber = jsonstr.totalNumber;
- orderdetail.totalAmount = jsonstr.totalAmount;
- //保存購物車
- utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));
- }
- },
- //修改給買商品數量
- updateproductnum: function (id, num) {
- var ShoppingCart = utils.getParam("ShoppingCart");
- var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));
- var productlist = jsonstr.productlist;
- for (var i in productlist) {
- if (productlist[i].id == id) {
- jsonstr.totalNumber = parseInt(jsonstr.totalNumber) + (parseInt(num) - parseInt(productlist[i].num));
- jsonstr.totalAmount = parseFloat(jsonstr.totalAmount) + ((parseInt(num) * parseFloat(productlist[i].price)) - parseInt(productlist[i].num) * parseFloat(productlist[i].price));
- productlist[i].num = parseInt(num);
- orderdetail.totalNumber = jsonstr.totalNumber;
- orderdetail.totalAmount = jsonstr.totalAmount;
- utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));
- return;
- }
- }
- },
- //獲取購物車中的所有商品
- getproductlist: function () {
- var ShoppingCart = utils.getParam("ShoppingCart");
- var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));
- var productlist = jsonstr.productlist;
- orderdetail.totalNumber = jsonstr.totalNumber;
- orderdetail.totalAmount = jsonstr.totalAmount;
- return productlist;
- },
- //判斷購物車中是否存在商品
- existproduct: function (id) {
- var result = false;
- var ShoppingCart = utils.getParam("ShoppingCart");
- if (ShoppingCart != null) {
- var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));
- var productlist = jsonstr.productlist;
- for (var i in productlist) {
- if (productlist[i].id == id) {
- result = true;
- }
- }
- }
- return result;
- },
- //刪除購物車中商品
- deleteproduct: function (id) {
- var ShoppingCart = utils.getParam("ShoppingCart");
- var jsonstr = JSON.parse(ShoppingCart.substr(1, ShoppingCart.length));
- var productlist = jsonstr.productlist;
- var list = [];
- for (var i in productlist) {
- if (productlist[i].id == id) {
- jsonstr.totalNumber = parseInt(jsonstr.totalNumber) - parseInt(productlist[i].num);
- jsonstr.totalAmount = parseFloat(jsonstr.totalAmount) - parseInt(productlist[i].num) * parseFloat(productlist[i].price);
- } else {
- list.push(productlist[i]);
- }
- }
- jsonstr.productlist = list;
- orderdetail.totalNumber = jsonstr.totalNumber;
- orderdetail.totalAmount = jsonstr.totalAmount;
- utils.setParam("ShoppingCart", "‘" + JSON.stringify(jsonstr));
- }
- };
- //上面的基於html5 localStorage的購物車JS腳本使用方法
- var product =
- {
- ‘id‘: id, //屬性名用引號括起來,屬性間由逗號隔開
- ‘name‘: ‘hhh‘,
- ‘num‘:jq(‘#text-4‘).val(),
- ‘price‘:199.9
- };
- //商品加入到購物車
- cart.addproduct(product);
- var productlist=cart.getproductlist();//取出購物車商品
- alert(‘‘, ‘商品:‘+productlist[0].id+‘ ‘+productlist[0].name+‘ ‘+productlist[0].num+‘ ‘+productlist[0].price, ‘確定‘);
localStorage存值取值以及存取JSON,以及基於html5 localStorage的購物車