商品对比调用的JS文件(包含了商品对比框浮动JS):

/*浮动窗口*/
(function(){  
  var n=10;
  var obj=document.getElementById("goods-compare");
  if(!obj){
    return false;
  }
  var x=0;
  window.onscroll=function(){
    obj.style.top=(document.body.scrollTop||document.documentElement.scrollTop)+n+'px';
  };
  window.onresize=function(){
    obj.style.top=(document.body.scrollTop||document.documentElement.scrollTop)+n+'px';
  };  
})();
  
//添加显示对比框
function addcompare(chk){
  $('#goods-compare').fadeIn().show();
  var count=$(".compare-box li").length;
  if (count>2)//这里可以修改对比的数据哦
  {
    alert('产品比较最多选3种哦');
    return;
  }
  
  $.ajax({
    type: 'post',
    url: 'ajax.php',
    data: {
      'action':'1',
      'gid':chk.gid,//商品ID
      'gname':chk.gname,//商品名称
      'gtype':chk.gtype//商品类别,类别不同时不能比较
    },
    cache: false,
    async: false,
    success: function(result) {
      if(result!='')
      {
        alert(result);
      }else{
        var url='http://www.lusen.com/product-'+chk.gid+'.html';//设置商品的链接地址
        $(".compare-box").append("<li class='division clearfix' id='"+chk.gid+"'><div class='span-3'><a href='"+url+"' target='_blank' title='"+chk.gname+"'>'"+chk.gname+"'</a></div><span onclick=\"removecompare('"+chk.gid+"');\">删除</span></li>")
        $("#comids").val($(".compare-box li").map(function(){//将对比的所有商品ID,赋值给#comids
          return $(this).attr('id');
        }).get().join(","));
      }
    }
  });
}
  
//删除对比产品
function removecompare(id)
{
  $.ajax({
    type: 'post',
    url: 'ajax.php',
    data: {
      'action':'2',
      'gid':id
    },
    cache: false,
    success: function(result) {
      $("#"+id).remove();
      $("#comids").val($(".compare-box li").map(function(){
        return $(this).attr('id');
      }).get().join(","));
    }
  });
   
}
//清空对比产品
function clearcompare()
{  
  $.ajax({
    type: 'post',
    url: 'ajax.php',
    data: {
      'action':'3'
    },
    cache: false,
    success: function(result) {
      $(".compare-box").html('');
      $("#comids").val('');
    }
  });
}
//显示对比框
function showcompare()
{
  $.ajax({
    type: 'post',
    url: 'ajax.php',
    data: {
      'action':'4'
    },
    success: function(result) {
      if(result){
        $(".compare-box").append(result);
        $("#comids").val($(".compare-box li").map(function(){
          return $(this).attr('id');
        }).get().join(","));
        $('#goods-compare').fadeIn().show();
      }
    }
  });
   
}
  
//点击关闭对比框
$('.close-gc').click(function(){
  $('#goods-compare').fadeOut().hide();
});

商品对比调用Ajax文件:

<?php
function mb_unserialize($serial_str) {
  $serial_str =stripslashes($serial_str);
  return unserialize($serial_str);
}
if($_POST['action']=='1') {//add
  if(isset($_COOKIE['gtype'])) {
    if($_COOKIE['gtype']!=$_POST['gtype']) {
      echo '对不起,您选择的是不同类别的产品无法加入对比,请选择同类产品或清空当前对比栏再选择。';
      return;
    }
  }else {
    setcookie('gtype',$_POST['gtype']);
  }
  if(isset($_COOKIE['gid'])) {
    $arr_str = $_COOKIE['gid'];
    $arr=mb_unserialize($arr_str);
    if(count($arr)>2) {//商品比较数量
      echo "商品比较最多选3种";
      return;
    }
    foreach($arr as $val) {
      if($val[0]==$_POST['gid']) {
        echo "该商品已经加入对比框";
        return;
      }
    }
    $info=array($_POST['gid'],$_POST['gname'],$_POST['gtype']);
    $arr[]=$info;
    $arr_str=serialize($arr);
    setcookie('gid',$arr_str);
  }else {
    $info=array($_POST['gid'],$_POST['gname'],$_POST['gtype']);
    $arr[]=$info;
    $arr_str=serialize($arr);
    setcookie('gid',$arr_str);
  }
}else if($_POST['action']=='2') {//delone
  $id=$_POST['gid'];
  $arr_str = $_COOKIE['gid'];
  $arr=mb_unserialize($arr_str);  
  foreach($arr as $key=>$val) {
    if($val[0]==$id) {
      unset ($arr[$key]);
    }
  }
  $arr_str=serialize($arr);  
  setcookie('gid',$arr_str);
}else if($_POST['action']=='3') {//delall
  setcookie('gid','');
  setcookie('gtype','');
}else if($_POST['action']=='4') {//showlist
  if(isset($_COOKIE['gid'])) {
    $data='';
    $arr_str = $_COOKIE['gid'];
    $arr=mb_unserialize($arr_str); 
    foreach ($arr as $val){     
      $url="http://www.lusen.com/product-".$val[0].".html";
      $data.="<li id='{$val[0]}' class='division clearfix'><div class='span-3'><a href='{$url}' target='_blank' title='{$val[1]}'>{$val[1]}</a></div><span onclick=\"removecompare('{$val[0]}');\">删除</span></li>";
    }
    echo $data;
  }  
}
?>

php商品对比功能代码分享的更多相关文章

  1. 手机开发必备技巧:javascript及CSS功能代码分享

    1. viewport: 也就是可视区域.对于桌面浏览器,我们都很清楚viewport是什么,就是出去了所有工具栏.状态栏.滚动条等等之后用于看网页的区域,这是真正有效的区域.由于移动设备屏幕宽度不同 ...

  2. jQuery实现的手机发送验证码倒计时效果代码分享

    这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需 ...

  3. JAVA基础代码分享--DVD管理

    问题描述 为某音像店开发一个迷你DVD管理器,最多可存6张DVD,实现碟片的管理. 管理器具备的功能主要有: 1.查看DVD信息. 菜单选择查看功能,展示DVD的信息. 2.新增DVD信息 选择新增功 ...

  4. 原生JS实现购物车结算功能代码+zepto版

    html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  5. 【PHP开源产品】Ecshop的商品筛选功能实现分析之一

    一.首先,说明一下为什么要对category.php文件进行分析. 原因如下: ①个人对商城类商品筛选功能的实现比较好奇: ②对商城中关于商品的数据表设计比较感兴趣.(该功能涉及到与数据库的交互,而且 ...

  6. php版获取重定向后地址的代码分享

    如何获取重定向的地址呢?我们用php实现这样的功能,分享下我的代码,有需要的朋友参考下. 代码如下: <?php //取重定向的地址 class RedirectUrl{ //地址 var $u ...

  7. SpringMVC由浅入深day01_9商品修改功能开发

    9 商品修改功能开发 9.1 需求 操作流程: 1.进入商品查询列表页面 2.点击修改,进入商品修改页面,页面中显示了要修改的商品(从数据库查询) 要修改的商品从数据库查询,根据商品id(主键)查询商 ...

  8. JAVAEE——宜立方商城04:图片服务器FastDFS、富文本编辑器KindEditor、商品添加功能完成

    1. 学习计划 1.图片上传 a) 图片服务器FastDFS b) 图片上传功能实现 2.富文本编辑器的使用KindEditor 3.商品添加功能完成 2. 图片服务器的安装 1.存储空间可扩展. 2 ...

  9. 【SSH网上商城项目实战09】添加和更新商品类别功能的实现

    转自:https://blog.csdn.net/eson_15/article/details/51347734 上一节我们做完了查询和删除商品的功能,这一节我们做一下添加和更新商品的功能. 1.  ...

随机推荐

  1. 使用Xshell配置外网访问端口

  2. HTML5 浏览器支持

    css重置 header, section, footer, aside, nav, main, article, figure { display: block; } 为HTML添加新的元素 < ...

  3. linux安装openssl

    1.简介 给网站配置http2发现openssl版本不够,只能靠升级openssl了,shell让安装不再麻烦. 系统环境 centos 7.4 64位 安装 openssl1.1.1a版本 2.查看 ...

  4. 自学python之路(day4)

    一 购物车小程序 goods=[{}, {}, {}] shop_car={} li=[] ,len(goods)): li.append(i) money=input('请输入您的总金额:') if ...

  5. js 回调函数理解

    function A(callback) { console.log('我是主函数'); setTimeout(function () { callback("我是主函数传出的") ...

  6. spring cloud 工程构建

    https://blog.csdn.net/zhou199252/article/details/80745151 https://blog.csdn.net/forezp/article/detai ...

  7. div不固定高度垂直居中

    父容器的css属性 display:table;overflow:hidden;子容器的css属性 vertical-align:middle;display:table-cell; <!DOC ...

  8. Python环境搭建遇到问题及解决方案记录

    pip版本问题 环境使用Ubuntu16.04 , 安装pip3 $sudo apt-get install python3-pip 默认安装pip8.1.1,更新后是18.1 $pip3 insta ...

  9. geoserver 安装部署发布

    转载:https://blog.csdn.net/u010763324/article/details/80719229 1. 从http://geoserver.org/下载GeoServer安装包 ...

  10. 测试那些事儿-软测必备的linux知识(五)

    1.进程管理 1.1进程概述 在Linux中,每个执行的程序都称为一个进程,每个进程都分配一个ID号 每个进程,都会对应一个父进程,这个父进程可以复制多个子进程, 每个进程可能以两种方式存在,前台与后 ...