www.lightcourse.com/app/home/view/default/member/buy/buy_payment.html

<p style="font-size:0.9rem;font-family:"robotoMedium";">Please 1 submit payment in time to process your order as soon as possible! Online payment amount：</p>

<div class="dsc-receipt-info" id="paymentCon">

    <div class="dsc-receipt-info-title">

        <h3>Order List-</h3>

        {if !$deny_edit_payment}

        <a href="javascript:void(0)" ds_type="buy_edit" id="edit_payment">[{$Think.lang.modification}]</a>

        {/if}

    </div>

    <div class="dsc-candidate-items">

        <ul>

            <li>{$Think.lang.cart_step2_online_pay}</li>

        </ul>

    </div>

    <div id="payment_list" class="dsc-candidate-items" style="display:none">

        <ul>

            <li>

                <input type="radio" value="online" name="payment_type" id="payment_type_online">

                <label for="payment_type_online">{$Think.lang.cart_step2_online_pay}</label>

            </li>

            {notempty name="pay_goods_list.offline"}

            <li>

                <input type="radio" value="offline" name="payment_type" id="payment_type_offline">

                <label for="payment_type_offline">{$Think.lang.cart_step2_arrival_pay}</label>

                <a id="show_goods_list" style="display: none" class="dsc-payment-showgoods" href="javascript:void(0);">

                    <i class="iconfont">&#xe6f1;</i>{$Think.lang.cart_step2_arrival_pay} (<span data-cod-nums="offline">{:count($pay_goods_list.offline)}</span>{$Think.lang.ds_planting_goods}) + <i class="iconfont">&#xe64f;</i>{$Think.lang.cart_step2_online_pay} {present name="pay_goods_list.online"}(<span data-cod-nums="online">{:count($pay_goods_list.online)}</span>{$Think.lang.ds_planting_goods}){/present}</a>

            </li>

            {/notempty}

        </ul>

        <div class="hr16"> <a href="javascript:void(0);" class="dsc-btn dsc-btn-red" id="hide_payment_list">{$Think.lang.save_payment_method}</a></div>

    </div>

    <div id="dsc-payment-showgoods-list" class="dsc-payment-showgoods-list">

        <dl>

            {notempty name="pay_goods_list.offline"}

            <dt data-hideshow="offline">{$Think.lang.cart_step2_arrival_pay}</dt>

            <dd data-hideshow="offline" data-cod2-type="offline">

                {foreach name="pay_goods_list.offline" item="value"}

                <div class="goods-thumb"><span><img src="{:goods_thumb($value)}"></span></div>

                {/foreach}

            </dd>

            {/notempty}

            <dt data-hideshow="online">{$Think.lang.cart_step2_online_pay}</dt>

            <dd data-hideshow="online" data-cod2-type="online">

                {present name="pay_goods_list.online"}

                {foreach name="pay_goods_list.online" item="value"}

                <div class="goods-thumb"><span><img src="{:goods_thumb($value)}"></span></div>

                {/foreach}

                {/present}

            </dd>

        </dl>

    </div>

</div>



<!-- 在线支付和货到付款组合时，显示弹出确认层内容 -->

<div id="confirm_offpay_goods_list" style="display: none;">

    <dl class="dsc-offpay-list" data-hideshow="offline">

        <dt>{$Think.lang.following_commodity_support}<strong>{$Think.lang.cart_step2_arrival_pay}</strong></dt>

        <dd>

            {notempty name="pay_goods_list.offline"}

            <ul data-cod-type="offline">

                {foreach name="pay_goods_list.offline" item="value"}

                <li><span title="{$value.goods_name}"><img src="{:goods_thumb($value)}"></span></li>

                {/foreach}

            </ul>

            {/notempty}

            <label>

                <input type="radio" value="" checked="checked">

                {$Think.lang.cart_step2_arrival_pay}

            </label>

        </dd>

    </dl>

    <dl class="dsc-offpay-list" data-hideshow="online">

        <dt>{$Think.lang.following_commodity_support}<strong>{$Think.lang.cart_step2_online_pay}</strong></dt>

        <dd>

            <ul data-cod-type="online">

                {present name="pay_goods_list.online"}

                {foreach name="pay_goods_list.online" item="value"}

                <li><span title="{$value.goods_name}"><img src="{:goods_thumb($value)}"></span></li>

                {/foreach}

                {/present}

            </ul>

            <label>

                <input type="radio" value="" checked="checked">

                {$Think.lang.cart_step2_online_pay}

            </label>

        </dd>

    </dl>



    <div class="tc mt10 mb10"><a href="javascript:void(0);" class="dsc-btn dsc-btn-orange" id="close_confirm_button">{$Think.lang.confirm_payment_method}</a></div>

</div>

<script type="text/javascript">

    $(function(){



        var hybrid = {if $ifshow_offpay === true && isset($pay_goods_list['online'])}1{else/}0{/if};



        var failInPage = false;



// 重新调整在线支付/到付的商品展示

        var setCodGoodsShow = function() {

            var j = $('#allow_offpay_batch').val();

            var arr = {};

            if (j) {

                $.each(j.split(';'), function(k, v) {

                    vv = v.split(':');

                    arr[vv[0]] = vv[1] == '1' ? true : false;

                });

            }



            $.each(arr, function(k, v) {

                if (v) {

                    $("[data-cod-type='online']").appendTo("[data-cod-type='offline']");

                    $("[data-cod-type='online']").remove();



                    $("[data-cod2-type='online']").appendTo("[data-cod2-type='offline']");

                    $("[data-cod2-type='online']").remove();

                } else {

                    $("[data-cod-type='offline']").appendTo("[data-cod-type='online']");

                    $("[data-cod-type='offline']").remove();



                    $("[data-cod2-type='offline']").appendTo("[data-cod2-type='online']");

                    $("[data-cod2-type='offline']").remove();

                }

            });



            var off = $("[data-cod2-type='offline']").length;

            var on = $("[data-cod2-type='online']").length;



            $("[data-hideshow='offline']")[off ? 'show' : 'hide']();

            $("[data-hideshow='online']")[on ? 'show' : 'hide']();



            $("span[data-cod-nums='offline']").html(off);

            $("span[data-cod-nums='online']").html(on);



            failInPage = ! off;

            hybrid = off && on;



        };



        //点击修改支付方式

        $('#edit_payment').on('click',function(){

            $('#edit_payment').parent().next().remove();

            $(this).hide();

            $('#paymentCon').addClass('current_box');

            $('#payment_list').show();

            disableOtherEdit('{$Think.lang.save_first_payment_method}');

        });

        //保存支付方式

        $('#hide_payment_list').on('click',function(){

            var payment_type = $('input[name="payment_type"]:checked').val();

            if ($('input[name="payment_type"]:checked').size() == 0) return;



            setCodGoodsShow();



            //判断该地区(县ID)是否能货到付款

            if (payment_type == 'offline' && ($('#allow_offpay').val() == '0' || failInPage)) {

                layer.alert('{$Think.lang.area_not_supported_delivery}');

                return;

            }

            $('#payment_list').hide();

            $('#edit_payment').show();

            $('.current_box').removeClass('current_box');

            var content = (payment_type == 'online' ? '{$Think.lang.cart_step2_online_pay}' : '{$Think.lang.cart_step2_arrival_pay}');

            $('#pay_name').val(payment_type);



            if (payment_type == 'offline'){

                //如果混合支付（在线+货到付款）

                if (hybrid) {

                    content = $('#show_goods_list').clone().html();

                    $('#edit_payment').parent().after('<div class="dsc-candidate-items"><ul><li>{$Think.lang.payment_options}<br/><a href="javsacript:void(0);" id="show_goods_list" class="dsc-payment-showgoods">'+content+'</a></li></ul></div>');

                    $('#show_goods_list').hover(function(){showPayGoodsList(this)},function(){$('#dsc-payment-showgoods-list').fadeOut()});

                } else {

                    $('#edit_payment').parent().after('<div class="dsc-candidate-items"><ul><li>'+content+'</li></ul></div>');

                    $('#pd_panel').hide();

                }

            }else{

                $('#edit_payment').parent().after('<div class="dsc-candidate-items"><ul><li>'+content+'</li></ul></div>');

                $('#pd_panel').show();

            }

            ableOtherEdit();

        });

        $('#show_goods_list').hover(function(){showPayGoodsList(this)},function(){$('#dsc-payment-showgoods-list').fadeOut()});

        function showPayGoodsList(item){

            var pos = $(item).position();

            var pos_x = pos.left+0;

            var pos_y = pos.top+25;

            $("#dsc-payment-showgoods-list").css({'left' : pos_x, 'top' : pos_y,'position' : 'absolute','display' : 'block'});

            $('#dsc-payment-showgoods-list').addClass('dsc-payment-showgoods-list').fadeIn();

        }

        $('input[name="payment_type"]').on('change',function(){

            if ($(this).val() == 'online'){

                $('#show_goods_list').hide();

            } else {



                setCodGoodsShow();



                //判断该地区(县ID)是否能货到付款

                if (($('#allow_offpay').val() == '0') || failInPage) {

                    $('#payment_type_online').prop('checked',true);

                    layer.alert('{$Think.lang.area_not_supported_delivery}');

                }

                html_form('confirm_pay_type', '{$Think.lang.please_confirm_payment_method}', $('#confirm_offpay_goods_list').html(), 500,1);

                $('#show_goods_list').show();

            }

        });



        $('body').on('click','#close_confirm_button',function(){

            DialogManager.close('confirm_pay_type');

        });

    })

</script>