复制代码代码如下:
<%@ ภาษาเพจ = "java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
-
เส้นทางสตริง = request.getContextPath();
สตริง basePath = request.getScheme() + "://"
+ request.getServerName() + /// + request.getServerPort()
+ เส้นทาง + "/";
-
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<หัว>
<meta content="width=device-width, Initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<title>购物车</title>
<style type="text/css">
ร่างกาย{
พื้นหลัง: #fefbe6;
การจัดแนวข้อความ: กึ่งกลาง;
ระยะขอบ: 0;
ช่องว่างภายใน: 0;
สี: #500f60;
-
ลี่{
รายการสไตล์ประเภท: ไม่มี;
-
เป็น:ลิงค์{
รายการสไตล์ประเภท: ไม่มี;
-
img{
ความกว้าง: 100%;
ความสูง: 120px;
-
#คงที่{
ระยะขอบ: 0 อัตโนมัติ;
การจัดแนวข้อความ: ซ้าย;
-
#หลัก{
ความกว้าง: 100%;
ระยะขอบ: 0 อัตโนมัติ;
สี: #530a4a;
ตำแหน่ง: แน่นอน;
ด้านบน:110px;
-
#เมนอูล{
-
#เมน อุล ลี{
ความกว้าง: 20%;
ลอย: ซ้าย;
-
#main_t{
ตำแหน่ง: แน่นอน;
ด้านบน:140px;
สี: #530a4a;
ความกว้าง: 100%;
ระยะขอบ: 0;
ช่องว่างภายใน: 0;
ขนาดตัวอักษร: 0.8em;
-
#main_t_l,#main_t_a{
สี: #3f1262;
ความกว้าง: 100%;
ขนาดตัวอักษร: 0.8em;
-
#main_t_l ออล ลี{
ความกว้าง: 20%;
ลอย: ซ้าย;
-
#ซอน{
พื้นหลัง: #dbfff1;
สี: #f8cd66;
-
.bot_in{
พื้นหลัง: #f1fcc4;
เส้นขอบ: 3px #f1fcc4 ทึบ;
รัศมีเส้นขอบ: 6px 6px 6px 6px;
-moz-border-รัศมี: 6px;
-
#จิ{
ความกว้าง:130px;
ความสูง:30px;
filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=0);
-ms-filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType= 0);/*IE8*/
พื้นหลัง:สีแดง;
พื้นหลัง: -moz-linear-gradient (บน, แดง, rgba (0, 0, 255, 0.5));
พื้นหลัง: -webkit-gradient (เชิงเส้น, 0 0, 0 ด้านล่าง, จาก (#0dc613), ถึง (rgba (111, 246, 116, 0.5)));
พื้นหลัง: -o-linear-gradient (บน, แดง, rgba (0, 0, 255, 0.5));
สี: #fff;
ขอบบนสุด:6%;
เส้นขอบ: ไม่มี;
-
.จิ {
ความกว้าง:130px;
ความสูง:30px;
filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=0);
-ms-filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType= 0);/*IE8*/
พื้นหลัง:สีแดง;
พื้นหลัง: -moz-linear-gradient (บน, แดง, rgba (0, 0, 255, 0.5));
พื้นหลัง: -webkit-gradient (เชิงเส้น, 0 0, 0 ด้านล่าง, จาก (#0dc613), ถึง (rgba (111, 246, 116, 0.5)));
พื้นหลัง: -o-linear-gradient (บน, แดง, rgba (0, 0, 255, 0.5));
สี: #fff;
ขอบบนสุด:6%;
เส้นขอบ: ไม่มี;
-
</สไตล์>
<script type="text/javascript">
$(ฟังก์ชั่น() {
//点击加号购物车数量增加1
$(".add").live("คลิก",function(){
var isAdd = จริง;
var num = parseInt($(this).closest("li").find("#num").text());
var productId = $(this).closest("li").find("#productId").val();
var Totalprice = parseFloat($("#totalprice").text());
ราคา var = parseFloat($(this).closest("ul").find("#price").text());
ถ้า (!isNaN(num)) {
หมายเลข++;
ถ้า (หมายเลข > 99) {
หมายเลข = 99;
isAdd = เท็จ;
-
ถ้า (คือเพิ่ม) {
ราคารวม = ราคารวม + ราคา;
-
-
ผลรวม var = num * ราคา;
$(นี้).closest("li").find("#num").text(num);
$(this).closest("ul").find("#total").text(total);
$.post("<%=basePath%>updateShopCart.action","productId="+productId+"&num="+num,function(data){
ถ้า(data.success==true){
$("#ราคารวม").ข้อความ(ราคารวม);
-
-
-
//点击加号购物车数量减少1
$(".delete").live("คลิก",function(){
var isReduce = จริง;
var num = parseInt($(this).closest("li").find("#num").text());
var productId = $(this).closest("li").find("#productId").val();
var Totalprice = parseFloat($("#totalprice").text());
ราคา var = parseFloat($(this).closest("ul").find("#price").text());
ถ้า (!isNaN(num)) {
หมายเลข--;
ถ้า (หมายเลข < 1) {
หมายเลข = 1;
isReduce = เท็จ;
-
ถ้า (คือลด) {
ราคารวม = ราคารวม - ราคา;
-
-
ผลรวม var = num * ราคา;
$(นี้).closest("li").find("#num").text(num);
$(this).closest("ul").find("#total").text(total);
$.post("<%=basePath%>updateShopCart.action","productId="+productId+"&num="+num,function(data){
ถ้า(data.success==true){
$("#ราคารวม").ข้อความ(ราคารวม);
-
-
-
$("#cha").live("คลิก",function() {
var productId = $(this).closest("ul").find("#productId").val();
$.post("<%=basePath%>deleteFromShopCart.action","productId="+productId,function(data){
ถ้า(data.success==true){
getShopCartInfo();
-
-
-
ฟังก์ชั่น getShopCartInfo(){
$.ajax({
ชนิด : "โพสต์",
url : "<%=basePath%>findShopCart.action",
ความสำเร็จ : ฟังก์ชั่น (ข้อมูล) {
แถว var = "";
รายการ var = data.list;
$("#main_t_l").empty();
ผลรวมทั้งหมด = 0;
ถ้า(รายการ!=null&&list.length!=0){
สำหรับ(var i=0;i<list.length;i++){
รวม = รวม + รายการ [i] .price * รายการ [i] .num;
แถว = "<ul>"+
"<li style=/"width: 17%;text-align: center;/">"+list[i].productname+"</li>"+
"<li style=/"width: 17%;text-align: center;/" id=/"price/">"+list[i].price+"￥</li>"+
"<li style=/"width: 30%;text-align: center;/">"+
"<input type=/"hidden/" id=/"productId/" value="+list[i].id+">"+
"<สไตล์ปุ่ม=/"พื้นหลัง: #dbddd4;เส้นขอบด้านบน: ไม่มี;เส้นขอบ: 1px #dbddd4 ทึบ; รัศมีเส้นขอบ: 1px 1px 1px 1px;-moz-border-radius: 1px;/" id=/"num/">"+list[i].num+"</button>"+
"<สไตล์ปุ่ม=/"พื้นหลัง: #f5e3d5;เส้นขอบด้านบน: ไม่มี;เส้นขอบ: 1px #f5e3d5 ทึบ; รัศมีเส้นขอบ: 1px 1px 1px 1px;-moz-border-radius: 1px; สี: #c19268;/" class=/"delete/">-</button>"+
"<สไตล์ปุ่ม=/"พื้นหลัง: #f5e3d5;เส้นขอบด้านบน: ไม่มี;เส้นขอบ: 1px #f5e3d5 ทึบ; รัศมีเส้นขอบ: 1px 1px 1px 1px;-moz-border-radius: 1px; สี: #c19268;/" class=/"เพิ่ม/"+</button>"+
"</li>"+
"<li style=/"width: 18%;text-align: center;/"><span id=/"total/">"+list[i].totalprice+"￥</span></li>" +
"<li style=/"width: 18%;text-align: center;/">"+
"<img src=/"<%=basePath%>image/cha.png/" style=/"width: 25px;height: 25px/" id=/"cha/">"+
"</li>"+
"</ul>"+
"<hr size=/"3px;/" color=/"#c1c1c1/" style=/"width: 100%;/">";
$(แถว).appendTo($("#main_t_l"));
$("#totalprice").find("span").text(total);
-
}อื่น {
$("#main_t_l").append("<ul><li style=/"width: 100%;text-align: center;/">您的购物车为空,快去购物吧！</li> </ul>");
$("#totalprice").find("span").text(0);
-
-
-
-
//提交订单
$("#ji").คลิก(ฟังก์ชั่น(){
ชื่อ var = $("#name").val();
var tele = $("#tele").val();
ที่อยู่ var = $("#address").val();
var Totalprice = $("#totalprice").find("span").text();
ถ้า(ราคารวม == 0){
alert("购物车为空，不能提交订单!");
กลับ;
-
ถ้า(ชื่อ==""){
alert("姓名不能为空!");
กลับ;
-
ถ้า(โทร==""){
alert("电话不能为空!");
กลับ;
-
ถ้า(ที่อยู่==""){
alert("地址不能为空!");
กลับ;
-
$("#ji").attr("ปิดการใช้งาน","ปิดการใช้งาน");
$("#ji").css("พื้นหลัง","#808080");
document.getElementById("bgDiv").style.visibility = "การมองเห็น";
document.getElementById("myspin").style.visibility = "การมองเห็น";
$.post("<%=basePath%>addShopCart.action","name="+name+"&telephone="+tele+"&address="+address,function(data){
ถ้า (data.success == จริง) {
getShopCartInfo();
alert("提交成功");
}อื่น {
alert("提交失败,请重新提交!");
$("#ji").addClass("ji");
$("#ji").attr("ปิดการใช้งาน","");
-
-
-
window.onload = getShopCartInfo();
window.onload = ฟังก์ชั่น () {
document.getElementById("bgDiv").style.visibility = "ซ่อน";
document.getElementById("myspin").style.visibility = "ซ่อน";
-
-
//验证联系方式
ฟังก์ชั่น validTeleNum() {
วาร์เทล = /(^[0-9]{3,4}[0-9]{7,8}$)|(^[0-9]{7,8}$)|(^[0-9]{3 ,4}/-[0-9]{7,8}$) |(^[0-9]{7,8}$)|(^/([0-9]{3,4}/)[0-9]{3,8}$)|(^0{0 ,1}13[0-9]{9}$)/;
ถ้า (document.getElementById("tele").value != '') {
ถ้า (!tel.test(document.getElementById("tele").value)) {
alert("联系电话格式不正确,请重新输入!");
document.getElementById("tele").value = "";
-
-
-
</สคริปต์>
</หัว>
<ร่างกาย>
<jsp:include page="../jsp/progress.jsp"></jsp:include>
<div id="คงที่">
<div style="text-align: left;">
<a href="javascript:history.go(-1)"><img src="<%=basePath %>pic/fan4.png"></a>
<img src="<%=basePath %>pic/top5.jpg">
</div>
<div>
<div id="main">
<div>
<ul>
<li>单品</li>
<li>价格</li>
<li>数量</li>
<li>合计</li>
<li>删除</li>
</ul>
</div>
</div>
<div id="main_t">
<div id="main_t_l" style="margin-top: 20px;">
</div>
<div id="main_t_a" style="margin-top: 20px;">
<hr size="3px;" color="#c1c1c1" style=" width: 100%; ขอบด้านบน: 50px;">
<div id="zon"><br>
</div>
<ตาราง align="center">
<tr>
<td>姓名:</td>
<td><input type="text" id="name"/></td>
</tr>
<tr>
<td>联系方式:</td>
<td><input type="text" id="tele" onblur="validTeleNum()"/></td>
</tr>
<tr>
<td>地址:</td>
<td><input type="text" id="address"/></td>
</tr>
</ตาราง>
<div style="margin-left:60%;">
<span style="font-size: 1.2em; color: #f8cd66;">แบบอักษร</span>
<button style="พื้นหลัง: #f1fcc4; margin-left:5px;border: 3px #f1fcc4 solid; border-radius: 3px 3px 3px 3px;-moz-border-radius: 3px; color: #000;" id="ราคารวม"><span></span>￥</button>
<br><br>
</div>
<div style="พื้นหลัง: #f1fcc4 ;" align="ศูนย์">
<input type="button" id="ji" value="提交订单"></input><br>
<span style="font-size: 2em; color: #a6ae87; margin-left: 93%;">></span>
</div>
</div>
</div>
</div>
</div>
</ร่างกาย>
</html>