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


    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, '确定');



  • 相关阅读:
    Redis
    Redux架构
    Dapper.NET
    JS的异步模式
    Session Redis Nginx
    .NET CORE的TagHelper智能提示
    一个Redis实现的分布式锁
    Redisson使用起来很方便,但是需要redis环境支持eval命令
    The Little Redis Book
    mybatis UpdateByExampleMapper UpdateByExampleSelectiveMapper
  • 原文地址:https://www.cnblogs.com/smartsmile/p/6234119.html
Copyright © 2020-2023  润新知