Ajax+PHP制作购物车的详细教程_动视

Ajax+PHP制作购物车的详细教程

2020-11-27 19:57:19 责编:小采

这次给大家带来Ajax+PHP制作购物车的详细教程，Ajax+PHP制作购物车的注意事项有哪些，下面就是实战案例，一起来看一下。

购物车网页代码，具体内容如下

1.登录界面login.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="../jquery-1.11.2.min.js"></script>
<title>无标题文档</title>
</head>
<body>
<p>用户名：<input type="text" id="uid" /></p>
<p>密码：<input type="text" id="pwd" /></p>
<input type="button" value="登录" id="btn" />
</body>
<script type="text/javascript">
$("#btn").click(function(){
 var uid = $("#uid").val();
 var pwd = $("#pwd").val();
 $.ajax({
 url:"loginchuli.php",
 data:{u:uid,p:pwd},
 type:"POST",
 dataType:"TEXT",
 success: function(data){
 if(data.trim()=="OK")
 {
 window.location.href="main.php" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" ;
 }
 else
 {
 alert("用户名或密码错误");
 }
 }
 })
 })
</script>
</html>

2.登录处理页面loginchuli.php

<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
$uid = $_POST["u"];
$pwd = $_POST["p"];
$sql = "select password from login where username='{$uid}'";
$mm = $db->StrQuery($sql);
if($mm==$pwd && $pwd!="")
{
 $UserName = $_POST["uid"];
 $_SESSION["uid"]=$uid;
 echo "OK";
}
else
{
 echo "NO";
}

3.主页面main.php

<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title><br />
<style type="text/css">
.list{ width:100%; height:30px; margin-top:10px; text-align:center; line-height:30px; vertical-align:middle}
</style>
</head>
<body>
<p style="width:100%; height:100px; background-color:#6CC">
 <h1 style="float:left">大苹果商城</h1>
 <a style="float:right; margin-top:40px" href="zhuxiao.php">注销</a>
</p>
<br />
<p style="width:100%; height:600px">
 <p id="left" style="width:20%; float:left">
 <a href="main.php"><p class="list">浏览商品</p></a>
 <a href="zhanghu.php"><p class="list">查看账户</p></a>
 <a href="gouwuche.php"><p class="list">查看购物车</p></a>
 </p>
 
 <p id="right" style="width:80%; float:left">
<?php
 $agwc = array();
 if(!empty($_SESSION["gwc"]))
 {
 $agwc = $_SESSION["gwc"];
 }
 $zhonglei = count($agwc);
 $sum = 0;
 foreach($agwc as $v)
 {
 $sql = "select price from fruit where ids='{$v[0]}'";
 $danjia = $db->StrQuery($sql);
 $sum = $sum +$danjia*$v[1];
 }
 echo "<p>购物车中有:{$zhonglei}种商品，总价格为:{$sum}元.</p>";
 ?>
 <table width="100%" border="1" cellpadding="0" cellspacing="0">
 <tr>
 <td>代号</td>
 <td>水果名称</td>
 <td>水果价格</td>
 <td>源产地</td>
 <td>库存量</td>
 <td>操作</td>
 </tr>
 <?php 
 $sql = "select * from fruit";
 $attr = $db->Query($sql);
 
 foreach($attr as $v)
 {
 echo "<tr><td>{$v[0]}</td>
 <td>{$v[1]}</td>
 <td>{$v[2]}</td>
 <td>{$v[3]}</td>
 <td>{$v[4]}</td>
 <td><a href='goumai.php?code={$v[0]}'>购买</a></td></tr>";
 }
 ?> 
 </table>
 </p>
</p>
</body>
</html>

4.购买处理页面goumai.php

<?php
session_start();
$code = $_GET["code"];
if(empty($_SESSION["gwc"]))
{
 //第一次点击购买
 $attr = array(
 array($code,1)
 );
 $_SESSION["gwc"] = $attr;
}
else
{
 //不是第一次点击购买
 $attr = $_SESSION["gwc"];
 $bs=0;
 foreach($attr as $k=>$v)
 {
 if($v[0]==$code)
 {
 $bs=1;
 $attr[$k][1] = $attr[$k][1]+1;
 }
 }
 //如果没有在数组里面出现
 if($bs==0)
 {
 $shuzu = array($code,1);
 $attr[] = $shuzu;
 }
 
 $_SESSION["gwc"]=$attr;
 
}
header("location:main.php");

5.订单处理页面，计算选取水果的总价，和水果剩余量。dingdan.php

<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
$uid = $_SESSION["uid"];
$attr = array();
if(!empty($_SESSION["gwc"]))
{
 $attr = $_SESSION["gwc"];
}
//看下两个条件是否都满足
$bs = true;
//判断余额是否满足
 //根据用户名找余额
 $syue = "select account from login where username='{$uid}'";
 $yue = $db->StrQuery($syue);
 
 //根据购物车数组取总金额
 $sum = 0;
 foreach($attr as $v)
 {
 $sql = "select price from fruit where ids='{$v[0]}'";
 $danjia = $db->StrQuery($sql);
 $sum = $sum +$danjia*$v[1];
 }
 if($yue<$sum)
 {
 $bs = false;
 echo "YEBUZU";
 exit;
 }
 
//判断库存是否满足
foreach($attr as $v)
{
 $skucun = "select name,numbers from fruit where ids='{$v[0]}'";
 $akucun = $db->Query($skucun);
 if($akucun[0][1]<$v[1])
 {
 $bs = false;
 echo "{$akucun[0][0]}库存不足！";
 exit;
 
 }
}
//添加订单，减库存，减余额
if($bs)
{
 //减库存
 foreach($attr as $v)
 {
 $sql = "update fruit set numbers = numbers-{$v[1]} where ids='{$v[0]}'";
 $db->Query($sql,0);
 }
 
 //减余额
 $jianyue="update login set account=account-{$sum} where username='{$uid}'";
 $db->Query($jianyue,0);
 
 //添加订单
 $dingdanhao = $uid+date("YmdHis");
 $t = time();
 
 $sorder = "insert into orders values('{$dingdanhao}','{$uid}','{$t}')";
 $db->Query($sorder,0);
 
 foreach($attr as $v)
 {
 $sxq = "insert into orderdetails values('','{$dingdanhao}','{$v[0]}','{$v[1]}')";
 $db->Query($sxq,0);
 }
}
echo "OK";

6.购物车页面

<?php
session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title><br />
<style type="text/css">
.list{ width:100%; height:30px; margin-top:10px; text-align:center; line-height:30px; vertical-align:middle}
</style>
<script src="../../jquery-1.11.2.min.js"></script>
</head>
<body>
<p style="width:100%; height:100px; background-color:#6CC">
 <h1 style="float:left">大苹果商城</h1>
 <a style="float:right; margin-top:40px" href="zhuxiao.php">注销</a>
</p>
<br />
<p style="width:100%; height:600px">
 <p id="left" style="width:20%; float:left">
 <a href="main.php"><p class="list">浏览商品</p></a>
 <a href="zhanghu.php"><p class="list">查看账户</p></a>
 <a href="gouwuche.php"><p class="list">查看购物车</p></a>
 </p>
 
 <p id="right" style="width:80%; float:left">
 <table width="100%" border="1" cellpadding="0" cellspacing="0">
 <tr>
 <td>商品名称</td>
 <td>商品单价</td>
 <td>购买数量</td>
 <td>操作</td>
 </tr>
<?php
 include("../DBDA.class.php");
 $db = new DBDA();
 $attr=array();
 if(!empty($_SESSION["gwc"]))
 {
 $attr = $_SESSION["gwc"];
 }
 
 foreach($attr as $k=>$v)
 {
 $sql = "select name,price from fruit where ids='{$v[0]}'";
 $ashuiguo = $db->Query($sql);
 
 echo "<tr><td>{$ashuiguo[0][0]}</td><td>{$ashuiguo[0][1]}</td><td>{$v[1]}</td><td><a href='shanchu.php?sy={$k}'>删除</a></td></tr>";
 
 }
 
 ?>
 </table>
 <p id="tj">提交订单</p><p id="ts"></p>
 </p>
</p>
<script type="text/javascript">
$("#tj").click(function(){
 $.ajax({
 url:"dingdan.php",
 dataType:"TEXT",
 success: function(data){
 if(data.trim()=="OK")
 {
 alert("购买成功");
 }
 else if(data.trim()=="YEBUZU")
 {
 $("#ts").html("余额不足");
 $("#ts").css("color","red");
 }
 else
 {
 $("#ts").html(data);
 $("#ts").css("color","red");
 }
 }
 });
 })
</script>
</body>
</html>

7.购物车页面删除处理页面shanchu.php

<?php
session_start();
$sy = $_GET["sy"];
$attr = $_SESSION["gwc"];
if($attr[$sy][1]>1)
{
 $attr[$sy][1] = $attr[$sy][1]-1;
}
else
{
 unset($attr[$sy]);
 $attr = array_values($attr);
}
$_SESSION["gwc"]=$attr;
header("location:gouwuche.php");
8.账户余额页面zhanghu.php
<?php
session_start();
$uid = $_SESSION['uid'];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title><br />
<style type="text/css">
.list{ width:100%; height:30px; margin-top:10px; text-align:center; line-height:30px; vertical-align:middle}
</style>
</head>
<body>
<p style="width:100%; height:100px; background-color:#6CC">
 <h1 style="float:left">大苹果商城</h1>
 <a style="float:right; margin-top:40px" href="zhuxiao.php">注销</a>
</p>
<br />
<p style="width:100%; height:600px">
 <p id="left" style="width:20%; float:left">
 <a href="main.php"><p class="list">浏览商品</p></a>
 <a href="zhanghu.php"><p class="list">查看账户</p></a>
 <a href="gouwuche.php"><p class="list">查看购物车</p></a>
 </p> 
 <p id="right" style="width:80%; height:150px; float:left">
<?php
 include("../DBDA.class.php");
 $db = new DBDA();
 $sql = "select Account from login where UserName='{$uid}'";
 $result = $db->strQuery($sql);
 
 echo ("您的账户中还剩余".$result);
 ?>
 </p>
</p>
</body>
</html>

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

全部频道