Javascript操纵Cookie实现购物车程序


Posted in Javascript onFebruary 15, 2007
/***************************************************************************************************** 
Name
购物车 
Version

1.1 
Author

Vanni(凡林) url:www.27sea.com QQ:303590170 
CreateDate
2005-05-31 
Description 

此类是基于JavaScript和客户端Cookie,请保证客户端开启Cookie 

数据保持(默认24*30小时)可以通过 this.expire=? 小时来指定 

类中两自带的两个对象 typeObj 和 proObj 均有两个相同属性名: name 和 value  
类中数据存储形式如下----------------------------------- 
Array( 
new typeObj('汽车',array( 


new porObj('三菱',200), 


new proObj('本田',500) 
) 

), 

new typeObj('蛋',array( 


new proObj('鸡蛋',10), 


new proObj('鸭蛋',20) 

) 
} 
Cookie 存取形式为[使用escape()函数加密过]-------------- 

购物车名 = 汽车#三菱:200|本田:500,蛋#鸡蛋:10|鸭蛋:20 
注意:客户端存Cookie时,不会出现问题。如果要循环存储的话,可能会出现有些存入,而有些未存入 

 解决方法:见下例(获得URL里的sales的数量,并存入Cookie) 
文件:/depot/compareproduct.php 中的JS代码片段 
<script language="javascript"> 
var car=new Car('compare'); 
var typeName='list'; 
car.delType(typeName);

//将先前对比的产品清除 
//得到URL里的参数,并分隔成数组 
var url=location.href; 
var start=url.lastIndexOf('?sales='); 
var end=url.indexOf('&'); 
if(end==-1)end=url.length; 
var urlparam=url.substring(url.lastIndexOf('?sales=')+7, end ).split(','); 
function setPageVal(){ 

if(car.getPro(typeName).length==urlparam.length)return;

//关键部分,如果数组长度不相等说明,有些Cookie没有存入 

else{ 


car.addType(typeName);





//增一个类别 


for(i=0;i<urlparam.length;i++){ 



car.addPro(typeName,urlparam[i],'');
//增加对比产品,如果存在,返回假 


} 


setTimeout('setPageVal();',100);


//再次调用自身,没有用递归,是因为递归速度太快,仍会有存不进的问题 

} 
} 
setPageVal();









//初始化数据 
function delItem(itemname){ 

car.delPro(typeName,itemname); 

var carData=car.getPro(typeName); 

var url=''; 

var carlen=carData.length; 

if(carlen>1){ 


for(i=0;i<carData.length;i++){ 



if(i==0)
url =carData[i].name; 



else

url+=','+carData[i].name; 


} 


document.write("waiting...."); 


location.href='../depot/compareproduct.php?sales='+url; 

}else{ 


if(confirm('如果删除它,那么只剩一个对比项了,是否关闭此窗口?')){ 



car.delCar(); 



window.close(); 


} 

} 
} 
</script> 
*****************************************************************************************************/ 
/** 
Cookie类 
*/ 
function Cookie(){ 

/** 

@desc 设置Cookie 

@return void 

*/ 

this.setCookie=function(name, value, hours){ 


var expire = ""; 


if(hours != null){ 



expire = new Date((new Date()).getTime() + hours * 3600000); 



expire = "; expires=" + expire.toGMTString(); 


} 


document.cookie = escape(name) + "=" + escape(value) + expire; 

} 

 

/** 

@desc 读取Cookie 

@return String 

*/ 

this.getCookie=function(name){ 


var cookieValue = ""; 


var search = escape(name) + "="; 


if(document.cookie.length > 0){  



offset = document.cookie.indexOf(search); 



if (offset != -1){  




offset += search.length; 




end = document.cookie.indexOf(";", offset); 




if (end == -1) end = document.cookie.length; 




cookieValue = unescape(document.cookie.substring(offset, end)) 



} 


} 


return cookieValue;

 

}
 
} 
function Car(name){ 

 

if( !window.clientInformation.cookieEnabled ) { 


alert('你的浏览器不支持Cookie无法使用此 购物车 系统'); 


return false; 

} 

 

//##内部变量############################################################# 

 

this.carName = name; 

this.expire
 = 24*30;

//购物车的有效时间(30天) 

this.carDatas = new Array(); 

this.cookie
 = new Cookie(); 

 

//##内部对象############################################################# 

 

this.typeObj=function(name,value){
//自带的 类别 对象 


this.name =name; 


this.value="/value; 

} 

this.proObj=function(name,value){
//自带的" 商品 对象 


this.name =name; 


this.value=value; 

} 

 

//##私有方法列表########################################################## 

// 

//
getTypePoint(typeName);



//得到购物车里类别数组里的下标 

//
getProPoint(typeName,proName);

//得到购物车里类别下的产品下标 

//
saveCookie()





//以特定的形式存储此购物车的Cookie 

// 

//######################################################################## 

 

/** 

@desc 得到购物车里类别数组里的下标,找到的话返回下标,否则返回 -1 

@return int 

*/ 

this.getTypePoint=function(typeName){ 


var isok=false; 


var i=0; 


for(;i<this.carDatas.length;i++){ 



if(this.carDatas[i].name==typeName){ 




isok=true;


//找到位置 




break; 



} 


} 


if(isok)
return i; 


else

return -1; 

} 

 

/** 

@desc 得到购物车里类别下的产品下标,找到返回下标,否则返回 -1 

@return int 

*/ 

this.getProPoint=function(typeId,proName){ 


var isok=false; 


var j = 0; 


var tempProObj=this.carDatas[typeId].value; 


for(;j<tempProObj.length;j++){ 



if(tempProObj[j].name==proName){ 




isok=true; 




break;
 



} 


} 


if(isok)
return j; 


else

return -1; 

} 

 

/** 

@desc 存储生成的Cookie字符串 

@return void 

*/ 

this.saveCookie=function(){ 


var outStr=''; 


for( i=0; i<this.carDatas.length; i++ ){ 



var typeName =this.carDatas[i].name; 



var typeValue=this.carDatas[i].value; 



var proOutStr=''; 



for( j=0; j<typeValue.length; j++ ){ 




if ( j==0 )
proOutStr = typeValue[j].name + ':' + typeValue[j].value; 




else

proOutStr += '|' + typeValue[j].name + ':' + typeValue[j].value; 



} 



if ( i==0 )
outStr = typeName + '#' + proOutStr; 



else

outStr += ',' + typeName + '#' + proOutStr; 


} 


this.cookie.setCookie(this.carName,outStr,this.expire);
//存入 Cookie
 

} 


 

//##构造语句############################################################ 

 

if(this.cookie.getCookie(name)==''){ 


this.cookie.setCookie(name,'',this.expire); 

}else{ 


var tempTypes=this.cookie.getCookie(name).split(','); 


for(i=0;i<tempTypes.length;i++){ 



var tempTypeObj=tempTypes[i].split('#'); 



var type_pro=new Array(); 



if(tempTypeObj[1]){ 




var tempProObj=tempTypeObj[1].split('|'); 




for(j=0;j<tempProObj.length;j++){ 





var proDesc=tempProObj[j].split(':'); 





type_pro.push(new this.proObj(proDesc[0],proDesc[1])); 




} 



} 



this.carDatas.push(new this.typeObj(tempTypeObj[0],type_pro)); 


} 

} 

//##公共方法列表######################################################### 

// 

//
addType(typeName);




//增加一个类别 

//
addPro(typeName,proName,value);

//增加一个产品 

//
editPro(typeName,proName,value);
//修改产品的值 

//
delPro(typeName,proName);


//删除购物车内的一个类别下的产品 

//
delType(typeName);




//删除购物车内的一个类别,包括类别下的产品 

//
delCar();






//删除购物车 

//
 

//
getCar();






//得到整个购物车的数据 

//
getType();






//得到购物车内的所有类别列表 

//
getPro(typeName);




//得到购物车内指定类别下的产品列表 

//
getProVal(typeName,proName);

//得到购物车内指定类别下的产品属性 

// 

//######################################################################## 

 

/** 

@desc 在购物车里增加一个类别,增加成功返回真,否则返回假 

@return bool 

*/ 

this.addType=function(typeName){ 


if(this.getTypePoint(typeName)!=-1)

return false;



//如果已经有此类别了,返回假 


this.carDatas.push(new this.typeObj(typeName,new Array()));


//push进 自身数组 


this.saveCookie();
//存入 Cookie 


return true; 

} 

 

/** 

@desc 在购物车里增加一个产品,增加成功返回真,否则返回假 

@return bool 

*/ 

this.addPro=function(typeName,proName,value){ 


var typePoint=this.getTypePoint(typeName);


if ( typePoint ==-1 ) return false;

//没有此类别,无法增加,返回假 


var proPoint =this.getProPoint(typePoint,proName);
if ( proPoint != -1 ) return false;

//有此产品了,无法增加重复,返回假 


this.carDatas[typePoint].value.push(new this.proObj(proName,value));
//push到自身数组 


this.saveCookie();
//存入 Cookie 


return true; 

} 

 

/** 

@desc 修改购物车里的产品属性 

@return bool 

*/ 

this.editPro=function(typeName,proName,value){ 


var typePoint=this.getTypePoint(typeName);


if ( typePoint == -1 ) return false;
//没有此类别,无法修改,返回假 


var proPoint =this.getProPoint(typePoint,proName);
if ( proPoint == -1 ) return false;
//没有此产品,无法修改,返回假 


this.carDatas[typePoint].value[proPoint].value=value;






//更新自身  


this.saveCookie();
//存入 Cookie 


return true; 

} 

 

/** 

@desc 删除一个产品 

@return bool 

*/ 

this.delPro=function(typeName,proName){ 


var typePoint=this.getTypePoint(typeName);


if ( typePoint == -1 ) return false;
//没有此类别,无法删除,返回假 


var proPoint =this.getProPoint(typePoint,proName);
if ( proPoint == -1 ) return false;
//没有此产品,无法删除,返回假 


var pros=this.carDatas[typePoint].value.length; 


this.carDatas[typePoint].value[proPoint] = this.carDatas[typePoint].value[pros-1];
//最后一个产品放置要删除的产品上 


this.carDatas[typePoint].value.pop(); 


this.saveCookie();
//存入 Cookie 


return true; 

} 

 

/** 

@desc 删除一个类别 

@return bool 

*/ 

this.delType=function(typeName){ 


var typePoint=this.getTypePoint(typeName);
if ( typePoint == -1 ) return false;
//没有此类别,无法删除,返回假 


var types=this.carDatas.length; 


this.carDatas[typePoint] = this.carDatas[types-1];





//删除类别 


this.carDatas.pop(); 


this.saveCookie();
//存入 Cookie 


return true; 

} 

 

/** 

@desc 删除此购物车 

@return void 

*/ 

this.delCar=function(){ 


this.cookie.setCookie(this.carName,'',0); 


this.carDatas=new Array(); 


this.saveCookie();
//存入 Cookie 

} 

 

/** 

@desc 获得购物车数据 

@return Array 

*/ 

this.getCar=function(){ 


return this.carDatas; 

} 

 

/** 

@desc 获得类别列表 

@return Array 

*/ 

this.getType=function(){ 


var returnarr=new Array(); 


for ( i=0; i<this.carDatas.length; i++)

returnarr.push(this.carDatas[i].name); 


return returnarr; 

} 

 

/** 

@desc 获得类别下的产品列表 

@return Array 

*/ 

this.getPro=function(typeName){ 


var typePoint=this.getTypePoint(typeName);
if ( typePoint == -1 ) return false;
//没有此类别,返回假 


return this.carDatas[typePoint].value; 

} 

 

/** 

@desc 获得商品属性 

@return String 

*/ 

this.getProVal=function(typeName,proName){ 


var typePoint=this.getTypePoint(typeName);


if ( typePoint == -1 ) return false;
//没有此类别,返回假 


var proPoint =this.getProPoint(typePoint,proName);
if ( proPoint == -1 ) return false;
//没有此产品,返回假 


return this.carDatas[typePoint].value[proPoint].value; 

} 
}
Javascript 相关文章推荐
js获得地址栏?问号后参数的方法
Aug 08 Javascript
jquery数组封装使用方法分享(jquery数组遍历)
Mar 25 Javascript
Node.js中的模块机制学习笔记
Nov 04 Javascript
Javascript中使用parseInt函数需要注意的问题
Apr 02 Javascript
JS深度拷贝Object Array实例分析
Mar 31 Javascript
JQuery validate插件验证用户注册信息
May 11 Javascript
浅谈js原生拖放
Nov 21 Javascript
Angular.js之作用域scope'@','=','&amp;'实例详解
Feb 28 Javascript
js实现随机数字字母验证码
Jun 19 Javascript
使用layer弹窗提交表单时判断表单是否输入为空的例子
Sep 26 Javascript
微信小程序跨页面传递data数据方法解析
Dec 13 Javascript
一文帮你理解PReact10.5.13源码
Apr 03 Javascript
通过JAVASCRIPT读取ASP设定的COOKIE
Feb 15 #Javascript
用Javascript读取中文COOKIE的解决办法
Feb 15 #Javascript
在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码
Feb 15 #Javascript
实例:用 JavaScript 来操作字符串(一些字符串函数)
Feb 15 #Javascript
从Ajax到JQuery Ajax学习
Feb 14 #Javascript
JAVASCRIPT对象及属性
Feb 13 #Javascript
js判断浏览器的比较全的代码
Feb 13 #Javascript
You might like
360通用php防护代码(使用操作详解)
2013/06/18 PHP
PHP调用wsdl文件类型的接口代码分享
2014/11/19 PHP
php使用GD库创建图片缩略图的方法
2015/06/10 PHP
修改yii2.0用户登录使用的user表为其它的表实现方法(推荐)
2017/08/01 PHP
php中青蛙跳台阶的问题解决方法
2018/10/14 PHP
PHP7新功能总结
2019/04/14 PHP
让网页根据不同IE版本显示不同的内容
2009/02/08 Javascript
JavaScript去掉数组中的重复元素
2011/01/13 Javascript
JavaScript在IE和FF下的兼容性问题
2014/05/19 Javascript
javascript使用正则表达式检测IP地址
2014/12/03 Javascript
js实现延迟加载的方法
2015/06/24 Javascript
jQuery横向擦除焦点图特效代码分享
2015/09/06 Javascript
JavaScript事件类型中焦点、鼠标和滚轮事件详解
2016/01/25 Javascript
React diff算法的实现示例
2018/04/20 Javascript
微信小程序wx:for循环的实例详解
2018/10/07 Javascript
微信小程序 setData 对 data数据影响问题
2019/04/18 Javascript
了解Javascript中函数作为对象的魅力
2019/06/19 Javascript
解决Mint-ui 框架Popup和Datetime Picker组件滚动穿透的问题
2020/11/04 Javascript
自动化Nginx服务器的反向代理的配置方法
2015/06/28 Python
使用python编写监听端
2018/04/12 Python
解决python报错MemoryError的问题
2018/06/26 Python
python语音识别实践之百度语音API
2018/08/30 Python
解决Python运行文件出现out of memory框的问题
2018/12/03 Python
对Python生成汉字字库文字,以及转换为文字图片的实例详解
2019/01/29 Python
在python tkinter中Canvas实现进度条显示的方法
2019/06/14 Python
浅谈PyQt5 的帮助文档查找方法,可以查看每个类的方法
2019/06/25 Python
Python Web框架之Django框架cookie和session用法分析
2019/08/16 Python
利用setuptools打包python程序的方法步骤
2020/01/18 Python
CSS3自定义滚动条样式 ::webkit-scrollbar的示例代码详解
2020/06/01 HTML / CSS
欧洲最大的化妆品连锁公司:Douglas道格拉斯
2017/05/06 全球购物
领先的英国注册在线药房 :Simply Meds Online
2019/03/28 全球购物
农村党支部先进事迹
2014/01/14 职场文书
盗窃罪辩护词范文
2015/05/21 职场文书
演讲比赛主持词
2015/06/29 职场文书
导游词之蜀山胜景瓦屋山
2019/11/29 职场文书
vue3语法糖内的defineProps及defineEmits
2022/04/14 Vue.js