鄙人最新作,购物车程序完善版

本文详细阐述了购物车类的实现,包括商品类、购物车类及其与前端的交互,涉及商品信息管理、数量调整、总价计算等功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

/**********************************购物车类***************************************/ 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='+new Date(), 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(){//触发 _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='/step2/'; }); } /**********************购物车类***********************************/ /******************实例化对象******************/ var productCollections= new productCollection(); var cartTest=new cart(); cartTest.setCollection(productCollections); new shoppingTrolley();

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值