zoukankan      html  css  js  c++  java
  • ECSHOP 商品详情页 购物车页 添加购买数量加减按钮

    找到模板文件中的good.dwt,查找类似 <input
    name="number" type="text"

    的数量文件输入控件(有的模板可能整合到了类似goods_info.lib库文件中)。

    将这一整段<input …… />修改为

    <script language="javascript" type="text/javascript">
    
    function goods_cut(){
    
    var num_val=document.getElementById('number');
    
    var new_num=num_val.value;
    
    var Num = parseInt(new_num);
    
    if(Num>1)Num=Num-1;
    
    num_val.value=Num;
    
    }
    
    function goods_add(){
    
    var num_val=document.getElementById('number');
    
    var new_num=num_val.value;
    
    var Num = parseInt(new_num);
    
    Num=Num+1;
    
    num_val.value=Num;
    
    }
    </script>
    
    <span class="goods_cut" onclick="goods_cut();changePrice();"></span>
    <input name="number" type="text" class="goodsBuyBox" id="number" value="1" size="4" onblur="changePrice();"/>
    <span class="goods_add" onclick="goods_add();changePrice();"></span>

    再添加css样式:

    .goods_cut {
    background: url("../images/plus.gif") no-repeat scroll 0 0 transparent;
    border: 0 none;
    cursor: pointer;
    display: block;
    float: left;
    font-size: 0;
    height: 15px;
    line-height: 0;margin: 8px 3px 0;
    width: 15px;
    }
    input.goodsBuyBox, input.number {
    border: 1px solid #DDDDDD;
    float: left;
    font-size: 10px;
    height: 18px;
    line-height: 18px;
    margin: 5px 6px 0;
    padding: 0;
    text-align: center;
    width: 32px;
    }
    .goods_add {
    background: url("../images/plus.gif") no-repeat scroll 0 -15px transparent;
    border: 0 none;
    cursor: pointer;
    display: block;
    float: left;
    font-size: 0;
    height: 15px;
    line-height: 0;
    margin: 8px 3px 0;
    width: 15px;
    }
    .goods_number_tit{
        display: block;
        background:none;
        width:60px;
        height:25px;
        line-height:22px;
        float: left;
    }

    以下是购物车页面的修改方法!

    在flow_cart.lib 或者 flow.dwt里,看各自的模板去修改,总之要找到这窜代码:
    <input type="text" name="goods_number[{$goods.rec_id}]"   ……


    下面是脚本

                <script language="javascript" type="text/javascript">
                    function goods_cut($val){
                        var num_val=document.getElementById('number'+$val);
                        var new_num=num_val.value;
                        if(isNaN(new_num)){alert('请输入数字');return false}
                        var Num = parseInt(new_num);
                        if(Num>1)Num=Num-1;
                        num_val.value=Num;
                        document.getElementById('updatecart').click();
                    }
                    function goods_add($val){
                        var num_val=document.getElementById('number'+$val);
                        var new_num=num_val.value;
                        if(isNaN(new_num)){alert('请输入数字');return false}
                        var Num = parseInt(new_num);
                        Num=Num+1;
                        num_val.value=Num;
                        document.getElementById('updatecart').click();
                    }
                </script>

    找到 <input type="text" name="goods_number[{$goods.rec_id}]"


    搜索不到你就搜goods_number就行了


    替换为:

       <span class="goods_number_tit"> {$lang.number}:</span>
                                      <span class="goods_cut" onclick="goods_cut('{$goods.rec_id}');"></span>
                                        <input type="text" name="goods_number[{$goods.rec_id}]" id="number{$goods.rec_id}" value="{$goods.goods_number}" size="4" class="number" onblur="if(isNaN(this.value)){alert('请输入数字');return false}else{document.getElementById('updatecart').click();}" title="{$lang.goods_number_tip}"/>
                                        <span class="goods_add" onclick="goods_add('{$goods.rec_id}');"></span>

    再继续找到

    <input name="submit" type="submit" value="{$lang.update_cart}" class="btn_s3"/>

     

    其实就是更新购物车的按钮
    添加一个id=“updatecart

    <input name="submit" type="submit" id="updatecart" value="{$lang.update_cart}" class="btn_s3"/>

    附件有默认模板的示列文件。

    下载附件

  • 相关阅读:
    博弈论专题(持续更新)
    数论专题(持续更新)
    树的遍历专题(持续更新)
    直线折线分割平面问题
    字典树模板 HDU1251
    差分数组——面对大数据的处理
    最短路——dijkstra算法
    并查集与最小生成树
    KMP的初步认识及题目分析
    Codeforces Round#636(Div.3) D题 差分数组
  • 原文地址:https://www.cnblogs.com/wangblognet/p/2811430.html
Copyright © 2011-2022 走看看