购物车--cookie+ajax

$(function() {

 var prod_id = $("#prod_id").val();
 $("#buy_num_" + prod_id).blur(function() {
  if (isNaN($("#buy_num_" + prod_id).val())) {
   art_tips("請輸入數字");
   return false;
  }
  if ($("#buy_num_" + prod_id).val() < 1) {
   art_tips("購買的數量至少為1個");
   return false;
  }

 });

 /* 計算購買數量 */
 var prod_id = $("#prod_id").val();

 $("#add_num").click(
   function() {
    var over_amount = parseInt($("#over_amount_" + prod_id).val());
    var now_amount = parseInt($("#buy_num_" + prod_id).val());
    if (now_amount >=over_amount) {
     art_tips('庫存不足!請聯繫必買網站客服');
     return false;
    }
    $("#buy_num_" + prod_id).val(
      parseInt($("#buy_num_" + prod_id).val()) + 1);

   });
 $("#cut_num").click(
   function() {
    if ($("#buy_num_" + prod_id).val() <= 1) {
     art_tips("購買的數量至少為1個");
     window.reload();
     exit();
    }
    $("#buy_num_" + prod_id).val(
      parseInt($("#buy_num_" + prod_id).val()) - 1);

   });

 $(".go_cart").hover(function() {
  $(".sub_ch").removeClass("hidden");
  $(".go_cart").addClass("fo")
  list_cart();
  sub_hover();
 }, function() {
  $(".sub_ch").addClass("hidden");
  $(".go_cart").removeClass("fo");

 }

 );
 $('.pay_type li').click(
   function() {
    $(this).addClass("curr").siblings().removeClass("curr");
    $(".ff > form").eq($('.pay_type li').index(this)).show()
      .siblings().hide();
   });

 var ar = get_cookie('list');
 if (ar == null || ar.length < 1) {
  $('.clear_all').html('');
 } else {
  $('.clear_all')
    .html(
      '<a href="javascript:void(0)" οnclick="del_all_cart()">清空購物車</a>');
 }

 $(".selected_a").click(function() {
  $(".selected_a a").attr("href", '/mall/?sort=1');

 });
 $(".selected_d").click(function() {
  $(".selected_d a").attr("href", '/mall/?sort=2');

 });

 $("ul.thumb img").hover(function() {
  $(".auc_pic img").attr("src", $(this).attr("src"));
  $("ul.thumb img").removeClass('case');
  $(this).addClass('case');
 }, function() {
  $("ul.thumb img").removeClass('case');
 });

});

function sub_hover() {
 $(".sub_ch").hover(function() {
  $(".sub_ch").removeClass("hidden");
  $(".go_cart").addClass("fo");
  list_cart();
 }, function() {
  $(".sub_ch").addClass("hidden");
  $(".go_cart").removeClass("fo");
 });
}

// 加入購物車
function go_cart(prod_id) {

 var buy_num = $("#buy_num_" + prod_id).val();
 var price = $("#price_" + prod_id).val();
 var pro_pic = $("#pro_pic_" + prod_id).val();
 var pro_name = $("#pro_name_" + prod_id).val();

 // 加入购物车
 var ar = get_cookie('cart_list');
 if (ar == null || ar.length < 1) {
  var li = "|" + prod_id + "&" + buy_num + "&" + price + "&" + pro_pic
    + "&" + pro_name;

  set_cookie('cart_list', li, 604800 * 1000);
  art_tips('您已經成功把商品加入到購物車!');
  // window.reload();
 } else {
  myArray = ar.split('|');
  var ff = "|" + prod_id + "&" + buy_num + "&" + price + "&" + pro_pic
    + "&" + pro_name;
  var li = '';
  for ( var i = 1; i < myArray.length; i++) {

   var arrTmp = myArray[i].split('&');
   // 先判断刚增加的商品是否已存放在购物车中
   if (arrTmp[0] == prod_id) {
    // 已存在,需要更新的数据
    var num = parseInt(arrTmp[1]) + parseInt(buy_num);
    var li = li + "|" + arrTmp[0] + "&" + num + "&" + price + "&"
      + pro_pic + "&" + pro_name;
    var ff = '';
   } else {
    var li = li + "|" + arrTmp[0] + "&" + arrTmp[1] + "&"
      + arrTmp[2] + "&" + arrTmp[3] + "&" + arrTmp[4];
    // var
    // ff="|"+prod_id+"&"+buy_num+"&"+price+"&"+pro_pic+"&"+pro_name;
   }

  }

  del_cookie('cart_list');
  set_cookie('cart_list', li + ff, 604800 * 1000);
  art_tips('您已經成功把商品加入到購物車!');
  // window.reload();
 }
}

// 顯示購物車
function list_cart() {

 var ar = get_cookie('cart_list');
 
 //alert(ar);// alert(document.cookie);
 if (ar == null || ar.length < 1) {

  $("#ooo").html(
    '<div style="margin-left:20px; width:300px">您的購物車為空!<a href="http://www.'
      + base_url + '/mall">請先選購</a>,再來結算吧</div>');
  $("#sub_total").html('');
 } else {

  var myArray = ar.split('|');
  var ff = '';
  var money = '';
  var total = '';
  var total_num = '';
  for ( var i = 1; i < myArray.length; i++) {
   var arrTmp = myArray[i].split('&');
   var li = '<li>';
   li += '<div class="sub_pic"><img src="http://img.' + base_url + '/'
     + arrTmp[3] + '" /></div>';
   li += '<div class="sub_name"><a href="" title="' + arrTmp[4] + '">'
     + arrTmp[4] + '</a></div>';
   li += '<div class="sub_price">HK$<span style="font-size:14px;font-weight:900">'
     + arrTmp[2]
     + '</span><span style="color:black;font-size:10px;">x'
     + arrTmp[1] + '</span></div>';
   li += '<div class="sub_del" ><a href="javascript:void(0)" οnclick="del_cart('
     + arrTmp[0] + ')">刪除</a></div>';
   li += '<div class="sub_xu"></div>';
   li += '</li>';

   var ff = ff + li;
   var money = parseInt(arrTmp[1]) * parseFloat(arrTmp[2]);
   //alert(money);
   var total = (Number(total)*100 + parseFloat(money)*100)/100;
   var total_num = Number(total_num) + Number(arrTmp[1]);

  }
  var dd = '<div style="float:left;margin-left:200px;width:200px;">共 <span style="font-size:14px;color:red;">'
    + total_num
    + ' </span>件商品,共 計:<span style="color:red;font-size:10px;">HK$</span><span style="color:red;font-size:14px;font-weight:900">'
    + total
    + '</span></div><div class="buy_cart"><a οnclick="return insert_cart()" href="javascript:void(0)"  ></a></div'
  // alert(ff);http://www.'+base_url+'/member/?m=cart&a=cart_list
  $("#ooo").html(ff);
  $("#sub_total").html(dd);
 }

}

// 删除购物车
function del_cart(prod_id) {
 var ar = get_cookie('cart_list');

 var myArray = ar.split('|');
 var li = '';
 for ( var i = 1; i < myArray.length; i++) {
  var arrTmp = myArray[i].split('&');
  if (arrTmp[0] == prod_id) {
   var li = li + '';
  } else {
   var li = li + "|" + arrTmp[0] + "&" + arrTmp[1] + "&" + arrTmp[2]
     + "&" + arrTmp[3] + "&" + arrTmp[4];
  }

 }

 del_cookie('cart_list');
 set_cookie('cart_list', li, 604800 * 1000);
 //同时更新数据库
 $.getJSON("http://www." + base_url + "/mall/?m=index&a=del_mall&goods_id="
   + prod_id + "&callback=?", function(data) {
  if (data['msg'] == 1) {
  
   return true;
  } else {
   return false;
  }
 });
 art_tips('刪除成功');

}

// 清空購物車
function del_all_cart() {
 del_cookie('cart_list');
 //window.reload();
 art_tips('購物車已清空');

}

// 調用函數插入數據庫的
function insert_cart() {
 var ar = get_cookie('cart_list');
 if (ar != null || ar.length > 1) {

  $.getJSON("http://www." + base_url + "/mall/?m=index&a=mall_cart&list="
    + ar + "&callback=?", function(data) {
   if (data['stat'] == 1) {
    //del_cookie('list');
    window.location.href = 'http://www.' + base_url+ '/member/?m=cart&a=cart_list';
    return true;
   } else {
    window.location.href = 'http://www.' + base_url+ '/member/?m=cart&a=cart_list';
    return false;
   }
  });
 } else  window.location.href = 'http://www.' + base_url+ '/member/?m=cart&a=cart_list';
}

function add_one_mall(prod_id){
 
 var buy_num = $("#buy_num_"+prod_id).val();
 $.getJSON("http://www." + base_url + "/mall/?m=index&a=add_one_mall&goods_id="
   + prod_id + "&buy_num="+buy_num+"&callback=?", function(data) {
  if (data == 1) { 
   go_cart(prod_id);
   window.location.href = 'http://www.' + base_url+ '/member/?m=cart&a=cart_list';
  }
  if(data==0){
   window.location.href = 'http://www.' + base_url+ '/member/?m=cart&a=cart_list';
 
  }
 });
 
 
 
}

//更新cookie
function update_cookie(value){
 
   del_cookie('cart_list');
   set_cookie('cart_list',value,604800*1000);
 
}

 

 

//其中调用的函数

//js设置cookie函数
function set_cookie(name, value, unixtime)
{
 var ck = name + '=' + escape(value) + ';path=/';
 if ( unixtime) {
  var date = new Date();
  date.setTime(date.getTime() + unixtime);
  ck += ';expires=' + date.toGMTString();
 }
    document.cookie = ck;

}

//js获取cookie值

function get_cookie(name, ue)
{
    var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
    if(arr != null) {
        if (ue == true) {
            return decodeURIComponent(arr[2]);
        }
        return unescape(arr[2]);
    }
    return null;
}

//js删除cookie

function del_cookie(name)
{
 document.cookie = name + '=;path=/';
}


 

代码不重要。重要的是思想。(刚开始做的时候,真的挺纠结的。)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值