Javascript操纵Cookie实现购物车程序

复制代码 代码如下:

  /*****************************************************************************************************

  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;

  }

  }