九色国产,午夜在线视频,新黄色网址,九九色综合,天天做夜夜做久久做狠狠,天天躁夜夜躁狠狠躁2021a,久久不卡一区二区三区

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
動(dòng)態(tài)數(shù)據(jù)tab切換顯示

僅用于個(gè)人記錄學(xué)習(xí):demo圖


tab切換顯示動(dòng)態(tài)數(shù)據(jù)的方法---如此下圖效果 tab切換顯示時(shí)  數(shù)據(jù)需要分為幾個(gè)塊(有幾個(gè)tab分幾個(gè)塊), 且?guī)讉€(gè)狀態(tài)分開循環(huán)-如:已支付與未支付-首先先定義兩個(gè)數(shù)組,再循環(huán)data里面的數(shù)據(jù),分別賦值給定義的數(shù)組,如-總共5條數(shù)據(jù)-已支付2條-未支付3條-已支付狀態(tài)為1--未支付狀態(tài)為0   

demo:success : function(res) {

var datas=res.list; var arry=[],arrys=[]; for(var i=0;i arry.push(datas[i]):arrys.push(datas[i]); }

//循環(huán)得到已經(jīng)支付的數(shù)據(jù)

        for(var i=0;i

$('#accountPaid').html('里面放循環(huán)出來的數(shù)據(jù)');

}

//循環(huán)得到未支付的數(shù)據(jù)

for(var k=0;k

$('#Unpaid').html(' 里面放循環(huán)出來的數(shù)據(jù)');

}

}

demo代碼:

html:

   <div class="auto ove_hidden border5 bg_whie hider">

                            <ul id="myTab" class="nav nav-tabs">

                                <li class="active"  alt='all'><a href="#home" data-toggle="tab">所有訂單</a></li>

                                <li alt='4'><a href="#ios" data-toggle="tab">支付成功</a></li>

                                <li class="dropdown" alt='0'>

                                    <a href="#nopay" data-toggle="tab">未支付</a>

                                </li>

                            </ul>

                            <div class="oder-top-btn">

                            <span>綁定票據(jù)</span>

                            <span>贈(zèng)送票據(jù)</span>

                            </div>

                            <div id="myTabContent" class="tab-content">

                            <!--小標(biāo)題-->

                            <div class="order_13Left padding1 max991" style="border-right: 0px solid #D6D6D6;color:#0565b2;">

                                        <ul class="flex margin-btm0">

                                        <li>

                                            <span>商品信息</span>

                                        </li>

                                        <li>單價(jià)</li>

                                        <li>數(shù)量</li>

                                    </ul>

                                </div>

                                <div class="order_13Right1 ove_hidden padding1 max991">

                                    <ul class="margin-btm0">

                                        <li class="flex">實(shí)付款</li>

                                        <li class="flex">交易狀態(tài)</li>

                                        <li class="flex">

                                            <div class="width1" style="text-align: center;">

                                                <div class="width1">交易操作</div>

                                            </div>

                                        </li>

                                    </ul>

                                </div>

                                 <!--所有訂單-->

                                <div class="tab-pane fade in active" id="home">

                                    <div id="maxorder_boxlist0" class="maxorder_boxlist">

                                    <div class="showLoading">數(shù)據(jù)加載中 請(qǐng)稍等...</div>

                                    </div>

                                </div>

                                 <!--支付成功-->

                                <div class="tab-pane fade" id="ios">

                                    <div id="maxorder_boxlist1" class="maxorder_boxlist">

                                    <div class="showLoading">數(shù)據(jù)加載中 請(qǐng)稍等...</div>

                                    </div>

                                </div>

                                <!--未支付-->

                                <div class="tab-pane fade" id="nopay">

                                    <div id="maxorder_boxlist2" class="maxorder_boxlist">

                                    <div class="showLoading">數(shù)據(jù)加載中 請(qǐng)稍等...</div>

                                    </div>

                                </div>

                            </div>

                        </div>               

js:

//  我的訂單的點(diǎn)擊切換事件

$('#myTab li').click(function(){

var alt=$(this).attr('alt');

switch (alt){

case '0'://等待付款(未支付)

dynamicdomlist('0');

    break;

case '4'://交易成功(已支付)

dynamicdomlist('4');

    break;

}

});

function dynamicdomlist(order_status){

    var pchtml0='', pchtml='',pchtml2='';

//  $('#maxorder_boxlist0,#maxorder_boxlist1,#maxorder_boxlist2').html(' ');

//          訂單列表接口

    $.ajax({

        url : "index/orderlistapi",

        type : "post",

        data : {"data":''},

        success : function(res) {

            var datas=res.list;

            var arryall=[],arry=[],arrys=[];

            var alllist;

            //賦值數(shù)據(jù)給3個(gè)不同的數(shù)組顯示--1.所有訂單,2.支付成功,3.未支付

            for(var i=0;i<datas.length;i++){

                arryall.push(datas[i]);//所有訂單

                switch (datas[i].order_status){

                case 0://等待付款(未支付)

                case 5://關(guān)閉訂單-放在未支付里面

                arrys.push(datas[i]);

                break;

                case 4://交易成功(已支付)

                arry.push(datas[i]);

                break;

                }

            }

            switch (order_status){

            case '0'://等待付款(未支付)

            //得到未支付的數(shù)據(jù)

            alllist=arrys;

            break;

            case '4'://交易成功(已支付)

            //得到已支付的數(shù)據(jù)

            alllist=arry;

            break;

            default:

            //得到所有數(shù)據(jù)

            alllist=arryall;

            break;

            }

            //循環(huán)所有狀態(tài)---判斷在自己的狀態(tài)下自己有幾條數(shù)據(jù)

            for(var a=0;a<alllist.length;a++){

                var alllist_data=alllist[a];

                var order_statusv=alllist_data.order_status;

                //時(shí)間格式轉(zhuǎn)化

                var order_no= alllist_data.order_no.substr(0,4)+"-"+alllist_data.order_no.substr(4,2)+"-"+alllist_data.order_no.substr(6,2);

                var order_statusvstr='';

                var orderendstatus='';

                if(order_statusv==-1){

                    order_statusvstr='退款中';

                }else if(order_statusv==0){

                    order_statusvstr='等待付款';

                    orderendstatus='關(guān)閉訂單';

                }

                else if(order_statusv==4){

                    order_statusvstr='交易成功';

                }else{

                    order_statusvstr='訂單關(guān)閉';

                }

                var sum=0;

                sum=alllist_data.pay_money;

                pchtml+='<div class="order_box">';

                pchtml+='    <div class="order_1">';

                pchtml+='        <div class="order_12 auto">';

                pchtml+='            <span>'+order_no+'</span>';

                pchtml+='           <span> 訂單流水號(hào):'+alllist_data.out_trade_no+'</span>';

                pchtml+='            <span  class="iconfont icon-shanchu delete"></span>';

                pchtml+='        </div>';

                pchtml+='    </div>';

                pchtml+='    <div class="ove_hidden height_order">';

                pchtml+='       <div class="order_13Left">';

                pchtml+='            <div class="div-input"><input type="checkbox" id="" name="" lay-skin="primary" lay-filter="ticket" value="">';

pchtml+='            </div>';

                //得到每一項(xiàng)中的訂單量

                (function(i){

                    for(var j=0;j<alllist_data.ticket_list.length;j++){

                        var datalist=alllist_data.ticket_list[j];

//                      sum+=datalist.price*datalist.num;

                        pchtml+='        <ul class="flex margin-btm0 padding1 br-btm br-top">';

                        pchtml+='             <li>';

                        pchtml+='                 <span class="first_span">'+datalist.ticket_name+'</span>';

                        pchtml+='                  <span class="color_gay">使用日期:'+datalist.start_time.substr(0, 10)+' - '+datalist.end_time.substr(0, 10)+'</span>';

                        pchtml+='                  <span class="color_gay max992 Mobile">單價(jià):¥'+datalist.price+'</span>';

                        pchtml+='                  <span class="color_gay max992 Mobile">數(shù)量:'+datalist.num+'</span>';

                        pchtml+='              </li>';

                        pchtml+='              <li class="max991 pc">¥<span>'+datalist.price+'</span></li>';

                        pchtml+='              <li class="max991 pc">'+datalist.num+'</li>';

                        pchtml+='           </ul>';

                    }

                })(i)

                pchtml+='       </div>';

                pchtml+='       <div class="order_13Right ">';

                pchtml+='            <ul class="margin-btm0">';

                pchtml+='                <li class="flex max991">¥<span>'+sum+'</span></li>';

                pchtml+='                <li class="flex max991 pc">'+order_statusvstr+'</li>';

                pchtml+='                <li class="flex Mobile">';

                pchtml+='                   <div class="width1">';

                pchtml+='                        <div class="width1 max992 Mobile">'+order_statusvstr+'</div>';

                pchtml+='                        <div class="width1 check_order">';

                pchtml+='                            <a class="layui-btn layui-btn-normal layui-btn-xs" href="orderdetail?no='+alllist_data.order_id+'">查看</a>';

                if(order_statusv==0){

                    pchtml+='                        <a class="layui-btn layui-btn-warm layui-btn-xs " href="/platform/pay/getpayvalue?out_trade_no='+alllist_data.out_trade_no+'">去付款</a>';

                pchtml+='                        <a class="layui-btn layui-btn-danger layui-btn-xs">'+orderendstatus+'</a>';

                }else{}

                pchtml+='                        </div>';

                pchtml+='                    </div></li></ul></div></div></div>';

                switch (order_status){

            case '0':

            //得到未支付的數(shù)據(jù)

            $('#maxorder_boxlist2').html(pchtml);

            break;

            case '4':

            //得到已支付的數(shù)據(jù)

            $('#maxorder_boxlist1').html(pchtml);

            break;

            default:

            //得到所有數(shù)據(jù)

            $('#maxorder_boxlist0').html(pchtml);

            break;

            }

            }

            //刪除按鈕

            $('.delete').click(function(){

                $(this).parents('.order_box').remove();

            });

          },

        error: function(xhr, textStatus) { //錯(cuò)誤

            console.log(xhr);

        }

    });

}

本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
帶向左向右方向按鈕圖片無限循環(huán)左右滾動(dòng)JS代碼
3步輕松制作屬于自己的瀏覽器導(dǎo)航
后臺(tái)管理系統(tǒng)常用側(cè)導(dǎo)航,可折疊,三級(jí)導(dǎo)航
javascript寫的簡(jiǎn)單的計(jì)算器,內(nèi)容很多,方法實(shí)用,推薦
圖片瀏覽(附帶樣式+效果)
javascript – Backbone.js DOM在渲染方法中沒有準(zhǔn)備好應(yīng)用jquery魔法
更多類似文章 >>
生活服務(wù)
熱點(diǎn)新聞
分享 收藏 導(dǎo)長(zhǎng)圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服