ECSHOP商品购买数量增加加减按钮插件（包含购物车商品数量增加减少，自动更新）

ecshop商品页购买数量加减按钮ecshop购物车页加减按钮插件

默认模版为例详细教程：

找到flow.php里的如下代码

elseif ($_REQUEST[‘step‘] == ‘update_cart‘)
    {
        if (isset($_POST[‘goods_number‘]) && is_array($_POST[‘goods_number‘]))
        {
            flow_update_cart($_POST[‘goods_number‘]);
        }
        show_message($_LANG[‘update_cart_notice‘], $_LANG[‘back_to_cart‘], ‘flow.php‘);
        exit;
    }

修改成：

elseif ($_REQUEST[‘step‘] == ‘update_cart‘)
{
    if (isset($_POST[‘goods_number‘]) && is_array($_POST[‘goods_number‘]))
    {
        flow_update_cart($_POST[‘goods_number‘]);
    }
ecs_header("Location: flow.php?step=cart\n"); 
    show_message($_LANG[‘update_cart_notice‘], $_LANG[‘back_to_cart‘], ‘flow.php‘);
    exit;
}

一、商品页

打开：goods.dwt

{* 包含脚本文件 *}
{insert_scripts files=‘common.js‘}下面这段：

<script type="text/javascript">
function $id(element) {
  return document.getElementById(element);
}
//切屏--是按钮，_v是内容平台，_h是内容库
function reg(str){
  var bt=$id(str+"_b").getElementsByTagName("h2");
  for(var i=0;i<bt.length;i++){
    bt[i].subj=str;
    bt[i].pai=i;
    bt[i].style.cursor="pointer";
    bt[i].onclick=function(){
      $id(this.subj+"_v").innerHTML=$id(this.subj+"_h").getElementsByTagName("blockquote")[this.pai].innerHTML;
      for(var j=0;j<$id(this.subj+"_b").getElementsByTagName("h2").length;j++){
        var _bt=$id(this.subj+"_b").getElementsByTagName("h2")[j];
        var ison=j==this.pai;
        _bt.className=(ison?"":"h2bg");
      }
    }
  }
  $id(str+"_h").className="none";
  $id(str+"_v").innerHTML=$id(str+"_h").getElementsByTagName("blockquote")[0].innerHTML;
}

</script>

修改成：

<script type="text/javascript">
function $id(element) {
  return document.getElementById(element);
}
//切屏--是按钮，_v是内容平台，_h是内容库
function reg(str){
  var bt=$id(str+"_b").getElementsByTagName("h2");
  for(var i=0;i<bt.length;i++){
    bt[i].subj=str;
    bt[i].pai=i;
    bt[i].style.cursor="pointer";
    bt[i].onclick=function(){
      $id(this.subj+"_v").innerHTML=$id(this.subj+"_h").getElementsByTagName("blockquote")[this.pai].innerHTML;
      for(var j=0;j<$id(this.subj+"_b").getElementsByTagName("h2").length;j++){
        var _bt=$id(this.subj+"_b").getElementsByTagName("h2")[j];
        var ison=j==this.pai;
        _bt.className=(ison?"":"h2bg");
      }
    }
  }
  $id(str+"_h").className="none";
  $id(str+"_v").innerHTML=$id(str+"_h").getElementsByTagName("blockquote")[0].innerHTML;
}

//实际只是增加了这部分
function del(){
        var num = document.getElementById("number");
        var n = parseInt(num.value);
        if(n-1<=0){
                alert("必须选择一个商品");
        }else{
                num.value = n-1;
        }
}
function add(){
        var num = document.getElementById("number");
        var n = parseInt(num.value);
        num.value = n+1;
}

//实际只是增加了这部分

</script>

搜索：

<dd>
       <strong>{$lang.number}：</strong>
        <input name="number" type="text" id="number" value="1" size="4" onblur="changePrice()" style="border:1px solid #ccc; "/>
       </dd>

修改成：

　　<table>
          <tr>
            <td valign="middle" height="40" width="80" align="right"><font>{$lang.number}：</font> </td>
            <td valign="middle"><img src="images/jian.gif" style="display:block;" onclick="del();changePrice()" /> </td>
            <td><input name="number" type="text" id="number" value="1" size="4" onblur="changePrice()" style="border:1px solid #ccc; height:25px; width:30px; text-align:center; "/></td>
            <td><img src="images/jia.gif" style="display:block;" onclick="add();changePrice()" /> </td>
          </tr>
        </table>

将下面图片放到模板目录：（注意修改成你的图片路径）

  

二.购物车页面

打开：flow.dwt

1、找到

{* 包含脚本文件 *}
{insert_scripts files=‘common.js,shopping_flow.js‘}

<!--增加下面脚本代码-->

<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>

2、搜索：

<input type="text" name="goods_number[{$goods.rec_id}]" id="goods_number_{$goods.rec_id}" value="{$goods.goods_number}" size="4" class="inputBg" style="text-align:center " onkeydown="showdiv(this)"/>

修改成：

<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>

3.搜索：

<input name="submit" type="submit" class="bnt_blue_1" value="{$lang.update_cart}" />
修改成： 

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

打开：style.css文件，底部下面添加

.goods_cut {
background: url("images/yy.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/yy.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; }

5.将下面图片放到模板目录：（注意修改成你的图片路径）

新手使用的是默认模板可以直接覆盖下面附件：

ecshop购物车加减插件下载：www.ecshop119.com/moban-318.html

注： 原文的商品页的数量增加减少按钮没有添加价格改变的函数，如果查看原文的，在按钮上加上 changePrice()

如下：

<table>
          <tr>
            <td valign="middle" height="40" width="80" align="right"><font class="shop">{$lang.number}：</font> </td>
            <td valign="middle"><img src="images/jian.gif" style="display:block;" onclick="del();changePrice()" /> </td>
            <td><input name="number" type="text" id="number" value="1" size="4" onblur="changePrice()" style="border:1px solid #ccc; height:25px; width:30px; text-align:center; "/></td>
            <td><img src="images/jia.gif" style="display:block;" onclick="add();changePrice()" /> </td>
          </tr>
        </table>

转载请注明：ECshop119模板屋-ECshop教程网（全国最专业的ECSHOP插件制作商-专业ECSHOP二次开发）

时间： 2024-10-11 00:33:44

ECSHOP商品购买数量增加加减按钮插件（包含购物车商品数量增加减少，自动更新）的相关文章

ECSHOP 商品详情页购买数量 添加加减按钮

<input name="number" type="text" id="number" value="1" size="4" onblur="changePrice()" style="border:1px solid #ccc; "/> 修改为 <span class="goods_cut" _src="images

可定制的商品数量加减按钮

仿京东淘宝购物车商品的加减按钮,可定制程度较高,使用简单 支持自定义加/减按钮的标题内容.背景图片; 支持设置边框颜色; 支持使用键盘输入; 支持长按加/减按钮快速加减; 支持block回调与delegate(代理)回调. 支持使用xib创建.类方法创建.自定义大小 运行效果: 示例代码: 自定义加减按钮的标题悦德财富https://www.yuedecaifu.com 1 2 3 4 5 6 7 PPNumberButton *numberButton = [[PPNumberButton a

Android在导航栏添加音量加减按钮安卓源码案例

有些Android设备没有实体的音量调节按钮,或者从保护实体按键的角度考虑,就需要在导航栏的虚拟按键中添加音量加减调节按键. 在这里我推荐一下比较好的android源码片段网站:http://code.662p.com/list/173_1.html 效果如下图所示: 实现过程如下: 1.首先在SystemUI中添加音量加减的资源文件,路径如下: frameworks/base/packages/SystemUI/res/ 将图片放入对应的drawable文件夹,包括音量+,和音量-,见上图.

jQuery实现购物车数量的加减以及总价

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   <html xmlns="http://www.w3.org/1999/xhtml">   <head>   <title>jQuery实现购物车多物

小程序开发 - 购买数量之加减限制

需求: 至少选择一件 最多选择3件 这个比较简单,就不多说了,直接上代码 wxml <!-- 商品数量 --> <view class='shop-number'> <view class='shop-number-left'> <view class='shop-number-left-name'>购买数量</view> <view class='shop-number-left-desc'>每人限购3件</view>

jQuery购物数量数字加减运算效果

<a href="###" id="add" value="+">+</a> <input type="text" id="num" value="3" /> <input type="button" id="jian" value="-" /> <script> $(

2017-5-26 正则表达式，js实战（加减数量，全选）

1.正则表达式:验证数据格式的准确性. 用正则表达式判断手机号格式是否正确: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&qu

vue入门------简单购物车功能实现(全选，数量加减，价格加减）

简易购物车功能(无任何布局 主要是功能) 数量的加减 商品的总价钱 全选与全不选 删除(全选.价格 受影响) <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <div id="box"> 全选:<input type="checkbox" @click="handleAllChecked($event)&q

自定义数字加减控件

1_自定义数字加减控件的要求 创建Module -NumberAddSubView A_输入的只能是数字,而且不能通过键盘输入 B_通过加减按钮操作数字 C_监听加减按钮 D_数组有最小值和最大值的限制 E_自定义属性 2.提供接口,让外界监听到数字的变化 1_设置接口 @Override public void onClick(View v) { if (v.getId() == R.id.btn_sub) { //Toast.makeText(mContext,"减",Toast.