Home>Article>Web Front-end> Using Ajax and json to implement data interaction example of JD shopping cart settlement interface (graphic tutorial)
This article mainly introduces the data interaction example of using Ajax and json to realize the Jingdong shopping cart settlement interface. It is very good and has reference value. Friends in need can refer to it
总价：￥0
body,html,ul,li,a{ margin:0;padding:0;font-family:"microsoft yahei";list-style:none;text-decoration:none; } .fl{ float:left; } .fr{ float:right; } .f12{ font-size:12px; } .disl{ display:inline-block; } .w100{ width:100px; } .fw{ font-weight:bold; } .goodsList_menu{ width:990px;height:45px;background:#f3f3f3;margin:0 auto;line-height:45px; font-size:14px;color:#333;border:1px solid #ddd; } .goodsList_menu .goodsListfl ul li{ float:left;margin-right:80px;cursor:pointer; } .goodsList_menu .goodsListfr ul li{ float:left;margin-right:37px;text-align:center;cursor:pointer; } /*内容*/ .goodsList_content{ width:100%;height:80px;border-bottom:1px solid #eee;padding:20px 0;margin-top:40px; } .goodsList_content .disl{ line-height:20px;width:300px;cursor:pointer;margin-left:10px; } .goodsList_content .disl span:hover{ color:#e4393c; } .goodsList_content .disl p:hover{ color:#e4393c; } .goodsListnum .listNum{ widows:45px;height:21px;width:50px;border:1px solid #eee;text-align:center; outline:none; } .goodsListnum ul li{ float:left;margin-right:30px;text-align:center;cursor:pointer; } .goodsListnum ul li a{ border:1px solid #ddd;padding:2px 7px;color:#000; } .goodsListnum ul li p{ line-height:0;color:#666;font-size:12px;margin-top:-2px; } .buy_goods p{ background:url(../images/arrow.png)no-repeat;padding-left:30px;background-position:-20px -20px; } .buy_goods{ position:relative; } /*底部结账*/ .checkout{ height:55px;border:1px solid #eee;margin-top:20px;line-height:55px; } .checkout .checkoutleft ul li{ float:left;margin-right:10px;cursor:pointer; } .checkout .checkoutSum{ font-weight:bold;font-size:18px;color:#e64346; } .checkout .checkoutright input{ border:none;color:#fff;outline:none;width:100px;height:55px;line-height:55px; font-size:20px;background:#e64346;margin-left:50px;cursor:pointer; }
The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
Implementing WebApi Ajax cross-domain request solution based on CORS
ajax front-end and back-end cross-domain request processing method (Figure Text tutorial)
Native JS implements Ajax cross-domain request flask response content (graphic tutorial)
The above is the detailed content of Using Ajax and json to implement data interaction example of JD shopping cart settlement interface (graphic tutorial). For more information, please follow other related articles on the PHP Chinese website!