首页 > web前端 > js教程 > 正文

购物车程序完善版(JavaScript代码)

高洛峰
发布: 2016-11-26 10:13:40
原创
1496人浏览过

[javascript]
/**********************************购物车类***************************************/ 
 
    var product=function(productarr){/*商品类基类productarr=>array;productarr['id'],productarr['name'],productarr['pic'],=productarr['lvs'],productarr['width'],productarr['thickness '],productarr['length'],productarr['open'],productarr['capacity']*/ 
        var _id=productarr['id'],_name=productarr['name'],_pic=productarr['pic'],_price=productarr['price'],_weight=productarr['weight'],_originalprice=productarr['originalprice'],_this=this; 
        this.num=productarr['num']; 
        this.getname=function(){ 
            return _name; 
            } 
        this.getid=function(){ 
            return _id; 
            }    
        this.getprice=function(){ 
            return _price; 
            } 
        this.getweight=function(){ 
            return _weight; 
            } 
        this.getpic=function(){ 
            return _pic; 
            } 
        this.getoriginalprice=function(){ 
            return _originalprice; 
            } 
        this.setnum=function(newnum){ 
            _this.num=newnum; 
            } 
        this.gettotal=function(){ 
            var total=_this.num*_this.getprice(); 
            return total; 
            }    
         
        } 
     
    var makeproductobj=function(gid,pid,num){//制造product对象函数,返回制造的product对象,gid=>数据组id,pid=>商品id 
            /*********制造代码*********/ 
            var pdata=[]; 
            (function(gid,pid){ 
                $.ajax({ 
                    url:'/module/data/default.php?action=datadetail&groupid='+gid+'&id='+pid+'&r='+newdate(), 
                    type:'post', 
                    datatype:'xml', 
                    async:false, 
                    /**工厂方法***/ 
                    success:function(dataxml){ 
                        pdata.price=$(dataxml).children('root').children('extend19').text(); 
                        pdata.originalprice=$(dataxml).children('root').children('extend9').text(); 
                        pdata.weight=$(dataxml).children('root').children('extend21').text(); 
                        pdata.name=$(dataxml).children('root').children('name').text(); 
                        pdata.pic=$(dataxml).children('root').children('extend17').text(); 
                        } 
                    }); 
                })(gid,pid); 
            return new product({ 
                num:num, 
                name:pdata.name, 
                id:pid, 
                price:pdata.price, 
                pic:pdata.pic, 
                weight:pdata.weight, 
                originalprice:pdata.originalprice, 
                }); 
        } 
    var cartcookie=$.cookies.get('productitem');//cookie的全局变量=>'商品id|数量,商品id|数量' 
    //alert(mockcookie); 
     
    var productcollection=function(){//商品搜集类 
            var products=[]; 
            var hasone=function(productobj){ 
                var isone=0; 
                for(var i=0;i<products.length;i++){ 
                    if(products[i].getid()==productobj.getid()){ 
                        isone=1; 
                        break; 
                        } 
                    } 
                return isone; 
                } 
              var initproduct 
            /********初始哈products数组代码********/ 
                       //alert(mockcookie); 
              if(cartcookie){ 
                 initproduct=cartcookie.split(','); 
                 for(var i=0;i<initproduct.length;i++){ 
                   var _producttemp=initproduct[i].split('|'); 
                   var _proobj=new makeproductobj(4,parseint(_producttemp[0]),parseint(_producttemp[1])); 
                   if(hasone(_proobj)!=1){ 
                    products.push(_proobj); 
                   } 
                 } 
                          } 
            /*******初始哈products数组代码*********/ 
             
            this.addproduct=function(productobj){//添加商品 
                   if(hasone(productobj)!=1){ 
                        products.push(productobj); 
                    } 
                } 
            this.delproduct=function(productobj){//删除商品 
                var _tempproducts=[]; 
                for(var i=0;i<products.length;i++){ 
                    if(products[i].getid()!==productobj.getid()){ 
                        //console.log(products[i].getid()); 
                        _tempproducts.push(products[i]); 
                        } 
                    } 
                    products=_tempproducts; 
                }//del 
            this.setnumbypid=function(pid,newnum){//设置商品数量 
                    for(var k=0;k<products.length;k++){ 
                        if(products[k].getid()==pid){ 
                            products[k].setnum(newnum); 
                            break; 
                            } 
                        } 
                } 
            this.getproductbyid=function(pid){//pid为商品的id,获得商品对象 
                    for(var j=0;j<products.length;j++){ 
                        if(products[j].getid()==pid){ 
                            return products[j]; 
                            break; 
                            } 
                        } 
                    return false; 
                } 
            this.getproducts=function(){//获得商品对象数组 
                return products; 
                } 
            this.getneedmoney=function(){//获得所有商品的总价钱 
                var _needmoney=0; 
                for(var k=0;k<products.length;k++){ 
                    _needmoney+=products[k].gettotal(); 
                    } 
                return _needmoney; 
                }//getneedmoney  
        } 
         
     
    var cart=function(){//购物车类,productcollection为委托对象 
            var _productcollection=''; 
            var _nowcollection=''; 
            var _this=this; 
            this.setcollection=function(collection){//设置collection 
                _productcollection=collection; 
                _nowcollection=_productcollection;//动态collection对象 
                _this.settemp(); 
                } 
            this.temp=[];//初始化collection对象 
            this.settemp=function(){ 
                    if(!_productcollection){ 
                        throw new error('请先指定collection对象!'); 
                        } 
                    var listproduct=_productcollection.getproducts(); 
                    for(var i=0;i<listproduct.length;i++){ 
                            _this.temp[i]=[]; 
                            _this.temp[i]=listproduct[i]; 
                        } 
                }; 
            this.delproduct=function(pid){//删除单个商品pid->商品的id号 
                    var needproduct=_nowcollection.getproductbyid(pid); 
                    if(needproduct!=false){ 
                        _nowcollection.delproduct(needproduct); 
                        } 
                } 
            this.setnumbypid=function(pid,newnum){//设置某个商品的数量,pid->商品id 
                    _nowcollection.setnumbypid(pid,newnum); 
                } 
            this.getcurrentnumbypid=function(pid){//获得某个商品的数量,pid->商品id 
                    var productobj=_nowcollection.getproductbyid(pid); 
                    return productobj.num; 
                } 
            this.gettotalmoney=function(){//获得总金额 
                    var _money=_nowcollection.getneedmoney(); 
                    return _money; 
                } 
            this.gettotalmoneybypid=function(pid){//获得单个商品的总金额 
                    var _needproduct=_nowcollection.getproductbyid(pid); 
                    if(_needproduct===false){ 
                        throw new error('无此商品'); 
                        } 
                    var _totalmoney=_needproduct.gettotal(); 
                    return _totalmoney; 
                } 
            this.rendercart=function(){//渲染函数 
                    throw new error('错误,该方法必须在子类中实现'); 
                } 
            this.bindevent=function(){//绑定事件函数 
                    throw new error('错误,该方法必须在子类中实现'); 
                } 
            //this.rendercart(); 
            this.touchoff=function(){//触发 www.2cto.com  
                    _this.rendercart(); 
                    _this.bindevent(); 
                } 
            this.getnewcollection=function(){//获得新的collection对象 
                    return _nowcollection; 
                } 
        } 
/********************************购物车类****************************************/ 
        var shoppingtrolley=function(){ 
                //alert('test'); 
                /***************检查*****************/ 
                if(!carttest){ 
                    throw new error('请实例化cart对象'); 
                    } 
                /***************检查***************/ 
                carttest.rendercart=function(){//子渲染 
                            var _content=''; 
                            for(var i=0;i<this.getnewcollection().getproducts().length;i++){ 
                                    var _producteach=this.getnewcollection().getproducts()[i]; 
                                    //alert(_producteach.getname()); 
                                     _content+='<tr class="cartlist"><td height="25" align="center" valign="middle" bgcolor="#ffffff" class="name"><input type="hidden" value="'+_producteach.getid()+'"/>'+_producteach.getname()+'</td><td height="25" align="center" valign="middle" bgcolor="#ffffff"><em>$'+_producteach.getoriginalprice()+'</em></td><td height="25" align="center" valign="middle" bgcolor="#ffffff" class="red">$'+_producteach.getprice()+'</td><td height="25" align="center" valign="middle" bgcolor="#ffffff">'+_producteach.getweight()+'kg</td><td width="21" height="25"  align="center" valign="middle" class="numjian" bgcolor="#ffffff">-</td><td width="28" height="25" align="center" valign="middle" bgcolor="#ffffff" class="nownum"><span class="red">'+_producteach.num+'</span></td><td width="21" height="25"  align="center" valign="middle" class="numjia" bgcolor="#ffffff">+</td><td height="25" align="center" valign="middle" bgcolor="#ffffff" class="eachtotal">$'+_producteach.gettotal()+'</td><td height="25" align="center" valign="middle" bgcolor="#ffffff" class="red">delete</td></tr>'; 
                                } 
                            //document.write(_content); 
                            //alert(_content); 
                            $('#checkcart').find('tr').eq(0).after(_content);//渲染面板 
                            $('.step_total').find('.step_total_right').children('span').html('$'+carttest.gettotalmoney()); 
                            /**popboxcount**/ 
                    }//rendercart 
                    carttest.bindevent=function(){ 
                                    var _this=this; 
                                    //alert($('#'+win1.id).find('.cartlist').eq(0).html()); 
                                    $('#checkcart').find('.cartlist').each(function(index){ 
                                            var _each=$(this); 
                                            _each.find('td:last').css('cursor','pointer').click(function(){ 
                                                //alert('删除'); 
                                                var _tempthis=$(this); 
                                                _this.delproduct($(this).parents('tr').find('td:first').find('input[type=hidden]').val()); 
                                                $(this).parents('tr').remove(); 
                                                /*******重新计算商品的总金额*******/ 
                                                $('.step_total').find('.step_total_right').children('span').html('$'+_this.gettotalmoney()); 
                                                /*******重新计算商品的总金额*******/ 
                                                });//click删除商品 
                                             
                                            _each.children('td[class=numjia]').css('cursor','pointer').click(function(){ 
                                                    var _jiathis=$(this); 
                                                    //alert($(this).parents('tr').parents('table').find('input[type=hidden]').val()); 
                                                    _this.setnumbypid($(this).parents('tr').find('td:first').find('input[type=hidden]').val(),_this.getcurrentnumbypid($(this).parents('tr').find('td:first').find('input[type=hidden]').val())+1); 
                                                    //alert(_jiathis.parents('td').siblings('td[class=nownum]').children('input').val()); 
                                                    _jiathis.siblings('td[class=nownum]').html( 
                                                        _this.getcurrentnumbypid(_jiathis.parents('tr').find('td:first').find('input[type=hidden]').val()) 
                                                    ); 
                                                    /***********重新计算某个商品的总金额***********/ 
                                                    _jiathis.siblings('td[class=eachtotal]').children('span').html('$'+_this.gettotalmoneybypid(_jiathis.parents('tr').find('td:first').find('input[type=hidden]').val())); 
                                                    /***********重新计算某个商品的总金额***********/ 
                                                     
                                                    /*******重新计算商品的总金额*******/ 
                                                    $('.step_total').find('.step_total_right').children('span').html('$'+_this.gettotalmoney()); 
                                                    /*******重新计算商品的总金额*******/ 
                                                });//click增加商品数量 
                                            _each.children('td[class=numjian]').css('cursor','pointer').click(function(){ 
                                                    var _jianthis=$(this); 
                                                    if(_this.getcurrentnumbypid($(this).parents('tr').find('td:first').find('input[type=hidden]').val())>1){ 
                                                        _this.setnumbypid($(this).parents('tr').find('td:first').find('input[type=hidden]').val(),_this.getcurrentnumbypid($(this).parents('tr').find('td:first').find('input[type=hidden]').val())-1); 
                                                        _jianthis.siblings('td[class=nownum]').html( 
                                                        _this.getcurrentnumbypid($(this).parents('tr').find('td:first').find('input[type=hidden]').val()) 
                                                    ); 
                                                    /***********重新计算某个商品的总金额***********/ 
                                                    _jianthis.siblings('td[class=eachtotal]').children('span').html('$'+_this.gettotalmoneybypid(_jianthis.parents('tr').find('td:first').find('input[type=hidden]').val())); 
                                                    /***********重新计算某个商品的总金额***********/ 
                                                     
                                                    /*******重新计算商品的总金额*******/ 
                                                    $('.step_total').find('.step_total_right').children('span').html('$'+_this.gettotalmoney()); 
                                                    /*******重新计算商品的总金额*******/ 
                                                        }//如果当前商品数量大于1 
                                                });//click减少商品数量 
                                        });//each 
                            }//bindevent 
                    carttest.touchoff();//触发 
                     
                    $(window).unload(function(){//当离开页面时 
                            //alert('狗头拜'); 
                            var lastcollection=carttest.getnewcollection();  
                            var _products=lastcollection.getproducts(); 
                            //console.log(_products.length); 
                            var _cartcookie=''; 
                            var _countnum=0; 
                            for(var i=0;i<_products.length;i++){ 
                                    _cartcookie+=_products[i].getid()+'|'+_products[i].num+','; 
                                    _countnum+=_products[i].num*_products[i].getweight(); 
                                } 
                            _cartcookie=_cartcookie.substring(0,_cartcookie.length-1); 
                            //alert(_cartcookie); 
                            //alert(_cuntnum); 
                            //alert(_countnum); 
                            $.cookies.set('productitem',_cartcookie);//设置cookie 
                            $.cookies.set('countnum',_countnum);//设置量的cookie 
                        }); 
                         
                        $('#btn').click(function(){ 
                            /******************若未选择任何商品返回*****************/ 
                            var _listproducts=carttest.getnewcollection().getproducts(); 
                            if(_listproducts.length<0||_listproducts.length==0){ 
                                    alert('please select products!'); 
                                    return; 
                                } 
                            window.location.href="http://www.php1.cn/">                         }); 
                 
            } 
    /**********************购物车类***********************************/ 
     
    /******************实例化对象******************/  
    var productcollections= new productcollection(); 
    var carttest=new cart(); 
    carttest.setcollection(productcollections); 
    new shoppingtrolley(); 

相关标签:
java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号