ecshop产品列表页ajax加入购物车

1、製作ajax購買按鈕圖片，命名為ajaxbuy.png

2、修改themes/shanxue/style.css文件，找到goodsname樣式，在下面新增

.goodsItem p.ajaxbuy{width:220px; height: 30px; overflow: hidden; margin-top: 10px;}
.goodsItem p.ajaxbuy a{ display: block; width: 120px; height: 30px; background: url(images/ajaxbuy.png) 0 0 no-repeat; text-indent:-9999px; }

3、修改themes/shanxue/libiary/goods_list.lbi

在<p class="goodsname"></p>產品名稱下面增加

<p class="ajaxbuy"><a href="javascript:addToCart({$goods.goods_id})">加入购物车</a></p>

4、修改themes/shanxue/libiary/recommend_best.lbi文件

在<p class="goodsname"></p>產品名稱下面增加

<p class="ajaxbuy"><a href="javascript:addToCart({$goods.id})">加入购物车</a></p>

5、後台修改購物流程，將直接接入購物車修改為確定進入購物車提示

6、修改themes/shanxue/library/page_footer.lbi文件，在最底部增加

<div id="ajaxbuygray" class="ajaxbuygray">
          <div id="ajaxbuytips" class="ajaxbuytips">
          <h3>成功加入购物车</h3>
          <p><a href="flow.php" class="gocart">查看购物车</a> <a id="continuebuy" class="continuebuy">继续购物</a></p>
          </div>
        </div>

7、修改themes/shanxue/style.css最下面增加樣式

.ajaxbuytips{display:none;position:fixed;top:300px;left:50%;margin-left:-130px;width:250px;height:100px;padding:20px;z-index:9999;background:#fff;border:5px solid #f60;}
        .ajaxbuytips h3{width:100%;height:40px;line-height:40px;font-size:16px;padding:0;text-align:center;background:none;border-bottom:1px solid #ddd;margin:0;}
        .ajaxbuytips p{width:100%;height:40px;overflow:hidden;margin-top:20px;}
        .ajaxbuytips a.gocart{display:block;width:100px;height:30px;line-height:30px;background:#fa0;border:1px solid #f30;color:#930;text-align:center;position:relative;float:left;margin-left:15px;}
        .ajaxbuytips a.continuebuy{display:block;width:100px;height:30px;line-height:30px;background:#eee;border:1px solid #aaa;text-align:center;position:relative;float:left;cursor:pointer;margin-left:20px;}
        .ajaxbuytips a:hover{color:#fff;text-decoration:none;}
        .ajaxbuytips a.continuebuy:hover{color:#666;}
        .ajaxbuygray{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);z-index:9998;}

8、修改js/common.js文件

switch(result.confirm_type)部分修改為

case '1' :
          var ajaxbuytips = document.getElementById('ajaxbuytips');
          var ajaxbuygray = document.getElementById('ajaxbuygray'); 
          var continuebuy = document.getElementById('continuebuy');      
          ajaxbuygray.style.display = "block";
          ajaxbuytips.style.display = "block";
          continuebuy.onclick = function () {
            ajaxbuygray.style.display = "none";
            ajaxbuytips.style.display = "none";
          };
          break;