基于ecshop商城开发优惠券（红包）叠加使用功能

一般商城的优惠券（红包）都是只能使用一张的，但想要叠加使用的话，首先要新增字段来区别设置可不可叠加类型

input type=”hidden” name=”bonus” id=”bonus_id_{$k}” value=”0”

设置input隐藏域，id跟数组键值关联，选中的话value为红包的id，默认为0。
再把选中的红包ID都以字符串形式存到name为bonus1的input隐藏域value中，如：12,13,15… 用逗号隔开。

    <!--优惠券-->    <div class="bonus_part">      <p><span>优惠券</span>      </p>      <ul class="bonus_list_business">          <!-- 这个id 和name值千万不要动,要传给后台,不然没法使用红包!!! -->          <!--收集多个红包的id-->        <input type="hidden" name="bonus1" id="bonus_id" value="">        <!-- {foreach from=$bonus_list item=bonus key=k} -->        <input type="hidden" name="bonus" id="bonus_id_{$k}" value="0">        <input type="hidden" name="bonus_overlap" id="overlap_{$k}" {if $bonus.overlap eq 1 } value="1" {else} value="0" {/if}>        <li {if $order.bonus_id eq $bonus.bonus_id} {/if} onclick="selectBonus2(this, {$bonus.bonus_id},{$k})"> <!--selectBonus()方法已转移到shopping_flow.js文件中 ^-^ -->        <div class="bonus_info_business">          <span><em>￥{$bonus.bonus_money_formated}</em><strong>满{$bonus.min_goods_amount}可用</strong></span>          <p><b>{$bonus.type_name}</b><label>(优惠券) ({if $bonus.overlap eq 1 } 可叠加 {else} 不可叠加 {/if})</label></p>        </div>        <div class="bonus_date_business">          <p>截止{$bonus.use_end_date}</p>        </div>        <u></u><font></font>        </li>        <!-- {/foreach} -->      </ul>      <b id="no_overlap" style="color: red;margin-left: 35%;display: none;">你选择的优惠券不可叠加，不能再选择其他优惠券！</b>    </div>    <!-- #BeginLibraryItem "/Library/order_total.lbi" --><!-- #EndLibraryItem -->    <div  style="text-align: center;margin:8px auto;">      <input style="margin-top:25px;" type="image" src="images/bnt_subOrder.png" />      <input type="hidden" name="step" value="done" />    </div>

我的思路是这样的：

      当选择的优惠券不可叠加时，value等于对应的红包id，其他优惠券设置为不可点击事件，并把其他优惠券的value都变为0（防止之前点击了可叠加的券后再点击不可叠加券）；
取消选中时则恢复点击事件，其value等于0。

      当选择的优惠券可叠加时，value等于对应的红包id， 取消选中时其value等于0。

/** * 可判断红包是否可叠加，并可同时选中/取消多个叠加红包 * @param obj   选中的li * @param value   红包的id * @param k   选中红包对应的键值 */function selectBonus2(obj,value,k) {    $(obj).toggleClass('checkbox_frame');    var is_overlap = document.getElementById("overlap_" + k).value;    var num = document.getElementsByName("bonus");   //判断红包为不可叠加时    if (is_overlap == 0)    {        //选中不可叠加的红包        if ($(obj).hasClass("checkbox_frame"))        {            $(obj).css('border', '1px solid red');            $(obj).siblings().removeClass("checkbox_frame");            $(obj).siblings().css('border', '1px solid #ddd');            $(obj).siblings().css('pointer-events', 'none');  //禁止其他点击事件            document.getElementById("no_overlap").style.display = "block";            //选择不可叠加红包时其他ID赋值为0            for (var i = 0; i < num.length; i++) {              if (k == i) {                document.getElementById("bonus_id_" + k).value = value;              } else {                document.getElementById("bonus_id_" + i).value = 0;              }            }        } else {          $(obj).css('border', '1px solid #ddd');          $(obj).siblings().removeClass("checkbox_frame");          $(obj).siblings().css('border', '1px solid #ddd');          $(obj).siblings().css('pointer-events', 'auto');    //恢复点击事件          document.getElementById("bonus_id_" + k).value = 0;          document.getElementById("no_overlap").style.display = "none";        }    }    //判断红包为可叠加时    if (is_overlap != 0) {      if ($(obj).hasClass("checkbox_frame")) {          $(obj).css('border', '1px solid red');          document.getElementById("bonus_id_" + k).value = value;      } else {          $(obj).css('border', '1px solid #ddd');          document.getElementById("bonus_id_" + k).value = 0;      }    }    //收集红包ID    var bonus_ids = "";    for (var j = 0; j < num.length; j++) {      if (document.getElementById("bonus_id_" + j).value != 0) {        bonus_ids += document.getElementById("bonus_id_" + j).value + ",";      }    }    if(bonus_ids.length>0) {      bonus_ids = bonus_ids.substr(0, bonus_ids.length - 1);      document.getElementById("bonus_id").value = bonus_ids;    } else {      document.getElementById("bonus_id").value = 0;    }      Ajax.call('flow.php?step=change_bonus', 'bonus=' + bonus_ids, changeBonusResponse, 'GET', 'JSON');}

最后将优惠券的ID数组传过去后，计算优惠后的费用，设置优惠券状态（已使用）即可。