支付页面 css代码块 1.png
HTML代码块<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css/01.css" rel="stylesheet" type="text/css" media="all" /> <title>淘宝购物车</title> <script> //对商品进行增加或者减少 //对商品进行增加 function plusNum(name1){ var Name = document.getElementsByName(name1); //获取当前商品的的信息 var Num = Name[1].value; if(Num>=100){ alert("库存不足!"); Num--; } Num++; Name[1].value = Num; } //对商品数量进行降低 function lowNum(name1){ var Name = document.getElementsByName(name1); var Num = Name[1].value; if(Num<=1){ alert("宝贝不能减少了呢"); Num++; } Num--; Name[1].value = Num; } //对商品进行删除命令 //根据当前表格的索引号进行商品的删除 function deleteRow(rowId){ var Index=document.getElementById(rowId).rowIndex; //获取当前行的索引号 document.getElementById("tab1").deleteRow(Index); alert("宝贝不能减少了呢"); } function deleteRow(rowId){ var Index=document.getElementById(rowId).rowIndex; document.getElementById("tab1").deleteRow(Index); } function disp_alert() { alert("") } </script> <script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript"> //checkbox 全选/取消全选 var isCheckAll = false; function swapCheck() { if (isCheckAll) { $("input[type='checkbox']").each(function() { this.checked = false; }); isCheckAll = false; } else { $("input[type='checkbox']").each(function() { this.checked = true; }); isCheckAll = true; } } </script> </head> <body> <div> <img src="img/4.png"/> <td width="350px"><font size="5" color="">购物车</font></td> <td width="60px"> </td>                                                                                                                               <input width="10px" id="box" style="width: 350px; height: 30px; color:blanchedalmond; border: 2px solid red;" type="text" name="search" placeholder="请输入关键字"> <input width="350px" style="width: 80px; height: 35px; color:blanchedalmond;border: none;" class="footer" id="search" type="button" value="搜索"> </div> <table border="0"> <td width="125px"> <input type="checkbox" id="check" onclick="swapCheck()">全选</td> <td width="330px">商品信息</td> <td width="250px">价格</td> <td width="280px">数量</td> <td width="200px">操作</td> <td> 加入夹</td> </tr> </table> <table> <tr> <td > <input type="checkbox"><img src="img/5.png"/> <a href="https://adidas.tmall.com/?spm=a220o.1000855.1997427721.d4918089.6bed1b60PGORGK" target="_blank">店铺:阿迪达斯旗舰店</a></td> </tr> </table> <table id="tab1"> <!-- 第一件商品 --> <tr id="shop1"> <td width="85px"><input type="checkbox" name="shopName" onClick="swapCheck()"/></td> <td width="380px"><img class="s1"src="img/6.jpg" height="50" width="50"/> <a href="https://detail.tmall.com/item.htm?spm=a1z0d.6639537.1997196601.4.69997484m5j4Mn&id=596106537576" target="_blank">阿迪达斯官网三叶草 女子经典运动鞋 39码</a> <br/> <img src="img/1.png"/><img src="img/2.png"/><img src="img/3.png"/> </td> <td width="220px" ><font size="3" color="red">999</font></td> <td width="300px"><input type="button" value="-" name="三叶草" onClick="lowNum('三叶草');allNum();allPrice();"> <input type="text" value="1" size="3" name="三叶草" onClick="allNum();" onChange="allPrice();"> <input type="button" value="+" name="三叶草" onClick="plusNum('三叶草');allNum();allPrice();"></td> <td width="220px"><input type="button" value="删除" class="delete" onClick="deleteRow('shop1');allNum();allPrice();"></td> <td width="300px"><input type="button" value="" ></td> </tr> <!-- 第二件商品 --> <tr id="shop2"> <td width="85px"><input type="checkbox" name="shopName" onClick="swapCheck()"/></td> <td width="380px"> <img class="s1"src="img/7.jpg" height="50" width="50"/> <a href="https://detail.tmall.com/item.htm?spm=a1z0d.6639537.1997196601.13.69997484m5j4Mn&id=584192872965" target="_blank">阿迪达斯官网 ULTRABOOST 20</a><br/> <img src="img/1.png"/><img src="img/2.png"/><img src="img/3.png"/></td> <td width="220px"><font size="3" color="red">899</font></td> <td width="300px"><input type="button" value="-" name="TRABOOST" onClick="lowNum('TRABOOST');allNum();allPrice();"> <input type="text" value="1" size="3" name="TRABOOST" onClick="allNum();"> <input type="button" value="+" name="TRABOOST" onClick="plusNum('TRABOOST');allNum();allPrice();"></td> <td width="220px"><input type="button" value="删除" class="delete" onClick="deleteRow('shop2');allNum();allPrice();"></td> <td width="60px"><input type="button" value="" ></td> </tr> <!-- 第三件商品 --> <tr id="shop3"> <td width="85px"><input type="checkbox" name="shopName" onClick="swapCheck()"/></td> <td width="380px"> <img class="s1"src="img/8.jpg" height="50" width="50"/> <a href="https://detail.tmall.com/item.htm?spm=a1z0d.6639537.1997196601.22.69997484m5j4Mn&id=613075008444" target="_blank">阿迪达斯官网UltraBOOST男女跑步运动鞋</a><br/> <img src="img/1.png"/><img src="img/2.png"/><img src="img/3.png"/></td> <td width="220px"><font size="3" color="red">699</font></td> <td width="300px"><input type="button" value="-" name="UltraBOOST" onClick="lowNum('UltraBOOST');allNum();allPrice();"> <input type="text" value="1" size="3" name="UltraBOOST" onClick="allNum();"> <input type="button" value="+" name="UltraBOOST" onClick="plusNum('UltraBOOST');allNum();allPrice();"></td> <td width="220px"><input type="button" value="删除" class="delete" onClick="deleteRow('shop3');allNum();allPrice();"></td> <td width="4px"><input type="button" value="" ></td> </tr> </table> </table> <!-- 结算商品 --> <table type="checkbox" id="check"border="0"> <tr> <td width="60px"> </td> <td width="60px"> </td> <td width="60px"> </td> <td width="60px"> </td> <td width="60px"> </td> <td width="60px"> </td> <td width="60px"> </td> <td>                                                                                                                       合计(不含运费):0元</td> <td width="80px"><input type="button" class="footer"color="black" style="width: 80px; height: 35px; color:blanchedalmond;border: none;" value="结算" ></td> </tr> </table> </body> </html> </html>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>支付页面</title> </head> <body> <td width="200px">选择支付方式:</td> <td width="380px"><img class="s1"src="img/9.png" height="50" width="50"/> <td width="80px"><a href="https://127.0.0.1:8848/%E8%B4%AD%E7%89%A9%E8%BD%A602/%E6%94%AF%E4%BB%98%E6%88%90%E5%8A%9F%E9%A1%B5%E9%9D%A2.html" target="_blank"> <input type="button" class="footer"color="red" style="width: 80px; height: 35px; color:black;border: none;" value="支付宝支付" ></a> <td width="380px"><img class="s1"src="img/10.png" height="50" width="50"/> <td width="80px"><a href="https://127.0.0.1:8848/%E8%B4%AD%E7%89%A9%E8%BD%A602/%E6%94%AF%E4%BB%98%E6%88%90%E5%8A%9F%E9%A1%B5%E9%9D%A2.html" target="_blank"> <input type="button" class="footer"color="red" style="width: 80px; height: 35px; color:black;border: none;" value="微信支付" ></a> <td width="380px"><img class="s1"src="img/11.jpg" height="50" width="50"/> <td width="80px"><a href="https://127.0.0.1:8848/%E8%B4%AD%E7%89%A9%E8%BD%A602/%E6%94%AF%E4%BB%98%E6%88%90%E5%8A%9F%E9%A1%B5%E9%9D%A2.html" target="_blank"> <input type="button" class="footer"color="red" style="width: 80px; height: 35px; color:black;border: none;" value="云闪付" ></a> </body> </html>
支付成功跳转页面<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>支付成功页面</title> </head> <body> 支付成功!三秒后跳转到购物车界面... <span style="font-size:18px;"> </span><span style="font-size:24px;"><meta http-equiv="refresh" content="3;URL=https://127.0.0.1:8848/%E8%B4%AD%E7%89%A9%E8%BD%A602/%E8%B4%AD%E7%89%A9%E8%BD%A6%E9%A1%B5%E9%9D%A2.html"> </span> <span style="font-size:24px;"> </body> </html>
.s1{ max-width: 80px; float: left; } .delete{ border: none; color: blue; background-color: white; width: 60px; } .footer{ padding: 0; background: red; }
2.png
3.png
4.png
5.png
6.jpg
7.jpg
8.jpg
9.png
10.png
11.jpg
本网页所有视频内容由 imoviebox边看边下-网页视频下载, iurlBox网页地址收藏管理器 下载并得到。
ImovieBox网页视频下载器 下载地址: ImovieBox网页视频下载器-最新版本下载
本文章由: imapbox邮箱云存储,邮箱网盘,ImageBox 图片批量下载器,网页图片批量下载专家,网页图片批量下载器,获取到文章图片,imoviebox网页视频批量下载器,下载视频内容,为您提供.
阅读和此文章类似的: 全球云计算