在wamp环境下，用PHP的session会话控制完成购物车的效果，数据存放在数组里练习，没有连接数据库，效果不错，简单易懂,以下是各部分的代码
common.php
<?php header("content-type:text/html;charset=utf-8"); $arrPro = array( array('id'=>1,'img'=>'img/1.jpg','title'=>'小米移动电源5000mAh','price'=>49), array('id'=>2,'img'=>'img/2.jpg','title'=>'20000mAh小米移动电源2','price'=>149), array('id'=>3,'img'=>'img/3.jpg','title'=>'小米圈铁耳机Pro','price'=>129), array('id'=>4,'img'=>'img/4.jpg','title'=>'小米家电动滑板车','price'=>1999), array('id'=>5,'img'=>'img/5.jpg','title'=>'小米笔记本','price'=>3499), array('id'=>6,'img'=>'img/6.jpg','title'=>'米家LED智能台灯','price'=>169), array('id'=>7,'img'=>'img/7.jpg','title'=>'小米体重秤','price'=>99), array('id'=>8,'img'=>'img/8.png','title'=>'小米电视3s 48英寸','price'=>2599) );
index.php
<?php header("content-type:text/html;charset=utf-8"); require 'common.php'; session_start(); $sum = 0; $class = ""; //判断左上角购物车的样式显示 if(!empty($_SESSION['shopcar'])){ $data = $_SESSION['shopcar']; $sum = array_sum($data[4]); $class = "on"; //右上角圆点 if(empty($data[0])){ $class = ""; } } ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>商品展示</title> <style type="text/css"> section{ width:1032px; height: 700px; margin: 40px auto; } .top{ float: right; position: relative; width: 190px; height: 34px; border: 1px solid #ccc; margin-right: 32px; text-align: center; line-height: 34px; border-radius: 4px; transition: all .3s linear; -moz-transition: all .3s linear; -webkit-transition: all .3s linear; } .top a{ color: #d00; } .top:hover{ width: 210px; color: #fff; font-weight: bold; background-color: #d00; border-radius: 6px; } .top:hover a{ color: #fff; } .top:hover span{ background-color: #fff; color: #d00; } .top:hover .star{ right:150px; top: 0; font-size: 14px; color: #ff0; transform: rotate(1080deg); } .top span{ position: absolute; top:2px; right: 40px; width: 18px; height: 18px; font-weight: bold; border-radius: 9px; line-height: 18px; text-align: center; font-size: 12px; font-weight: border; color: #fff; } .star{ color: #fff; font-size: 48px; font-style: normal; position: absolute; right:530px; top:186px; transform: rotate(60deg); transition: all .3s ease; } .on{ background-color: #e00; } .list{ margin: 20px 20px; padding: 36px 0; list-style: none; } a{ display: block; color: #757575; text-decoration: none; } .list li{ float: left; height: 246px; width: 234px; padding: 10px 0 20px; margin-right:12px; margin-top: 20px; border: 1px solid #ccc; background: #fff; -webkit-transition: all .2s linear; transition: all .2s linear; } .list li:hover{ box-shadow: 2px 4px 5px #aaa; } .figure{ width: 150px; height: 150px; margin: 0 auto 18px; } .title{ color: #222; font-size: 14px; font-weight: normal; text-align: center; } .price{ margin: 0 10px 10px; text-align: center; color: #ff6700; } .cart{ margin: 0 15px 5px; text-align: center; } .cart a{ color: #a34; width: 190px; height: 24px; border-radius: 4px; margin: 0 8px 5px; text-align: center; } .cart a:hover{ color: #eee; box-shadow: 0 2px 1px #333,0 2px 1px #666; background-color: #ccc; background-image: linear-gradient(#33a6b8,#0089a7) } .num{ text-align: center; color: #ff6700; } </style> </head> <body> <section> <div> <a href="https://www.jb51.net/spcar.php" >我的购物车</a><span><?php echo $sum;?></span> <em>★</em> </div> <ul> <?php foreach ($arrPro as $key => $value):?> <li> <div> <a href=""><img src=" <?php echo $value['img'];?>" alt="小米移动电源5000mAh"></a> </div> <h3> <a href=""><?php echo $value['title'];?></a> </h3> <p><span>￥<?php echo $value['price'];?></span></p> <p><a href="action.php?id=<?php echo $value['id'];?>" >加入购物车</a></p> </li> <?php endforeach;?> </ul> <div></div> </section> </body> </html>
action.php
<?php if(!empty($_GET['id'])){ require 'common.php'; session_start(); $id = $_GET['id']; //把所选ID的商品信息遍历出来 foreach ($arrPro as $key => $value) { if($id == $value['id']){ $arrData = $arrPro[$key]; } } //用一个新的二维数组把商品信息存起来 $arrDatax[0][$arrData['id']] = $arrData['id']; $arrDatax[1][$arrData['id']] = $arrData['img']; $arrDatax[2][$arrData['id']] = $arrData['title']; $arrDatax[3][$arrData['id']] = $arrData['price']; $arrDatax[4][$arrData['id']] = 1; //判断是否有SESSION存在，有则在数组后添加，没有则直接存 if(empty($_SESSION['shopcar'])){ $_SESSION['shopcar'] = $arrDatax; header('Location:index.php'); }else{ //第一次购物之后的购物 //重新取出来，防止数据覆盖 $arrDataz = $_SESSION['shopcar']; if(in_array($id,$arrDataz[0])){ $arrDataz[4][$arrData['id']] += 1; $_SESSION['shopcar'] = $arrDataz; header('Location:index.php'); }else{ $arrDataz[0][$arrData['id']] = $arrData['id']; $arrDataz[1][$arrData['id']] = $arrData['img']; $arrDataz[2][$arrData['id']] = $arrData['title']; $arrDataz[3][$arrData['id']] = $arrData['price']; $arrDataz[4][$arrData['id']] = 1; $_SESSION['shopcar'] = $arrDataz; header('Location:index.php'); } } }else{ echo "购物车没有商品!"; }
spcar.php