遍历多重数组形成表格表头和表内容，去逗号，保留两位小数

最新推荐文章于 2022-06-07 16:12:35 发布

Do_It_Better

最新推荐文章于 2022-06-07 16:12:35 发布

阅读量654

点赞数

CC 4.0 BY-SA版权

分类专栏：功能实现

本文链接：https://blog.youkuaiyun.com/chose_DoIt/article/details/78742438

功能实现专栏收录该内容

41 篇文章

订阅专栏

本文介绍了一个使用Ajax获取市场数据并动态填充HTML表格的JavaScript脚本。该脚本通过点击事件触发数据请求，根据不同的日期参数获取游戏渠道安装量、CPI及花费等详细数据，并通过动态生成HTML表格的方式进行展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$(function(){
    //移动弹出层
    $(".move").draggable();
    $('#marketData_show_close').click(function(){
        $('#marketData_show_tbody').html(' ');
        $('#marketData_show').hide();
    })
    $('.market_more').click(function(){
        $('#market_more_table tbody').html('');
        $('#marketData_show').show();
        var moreBtn = $(this).attr("date");
        var marktet_tbody = ' ';
        var data_tbody = " ";

        $.ajax({
            type:"GET",
            url:"/MarketData/detail",
            data:{ date:moreBtn},
            dataType:"json",
            success:function(data){
                var date = data.date;
                var data = data.list;
           /*     var add_installs = 0;
                var add_spent = 0;*/
                $.each(data,function(channel,val){
                    let marktet_tbody_header=" ";
                    let marktet_tbody=" ";
                    let data_channel = channel ;
                    let add_installs=0;
                    let add_spent=0;
                    marktet_tbody_header += "<tr class='am-active'>"
                        +"<td>"+date+"</td>"
                        +"<td>"+data_channel+"</td>"
                        +"<td>"+"  "+"</td>"
                        +"<td>游戏"+"</td>"
                        +"<td id='"+data_channel+"_install'></td>"
                        +"<td id='"+data_channel+"_cpi'></td>"
                        +"<td id='"+data_channel+"_spent'></td>"
                        +"<tr>";
                    $.each(val,function(index,gamedata){
                        /*ÓÎÏ·idÄÚ²ã*/
                        marktet_tbody += "<tr>"
                            +"<td>"+date+"</td>"
                            +"<td>"+data_channel+"</td>"
                            +"<td>"+gamedata.language+"</td>"
                            +"<td class='remove_gid'>"+gamedata.gname+"["+gamedata.gid+"]"+"</td>"
                            +"<td>"+gamedata.installs+"</td>"
                            +"<td>"+gamedata.CPI+"</td>"
                            +"<td>"+gamedata.spent+"</td>"
                            +"<tr>";
                    /*  转化为整数，并去千位数逗号*/
                        add_installs+=parseInt((gamedata.installs.replace(",","")));//数据相加
                        add_spent+=parseInt((gamedata.spent.replace(",","")));//数据相加
                    })
                    $('#market_more_table tbody').append(marktet_tbody_header);
                    $('#market_more_table tbody').append(marktet_tbody);
                    $("#"+data_channel+"_install").text(add_installs);

			 			/* 保留两位小数*/

$("#"+data_channel+"_spent").text(add_spent.toFixed(2)); $("#"+data_channel+"_cpi").text((add_spent/add_installs).toFixed(2)); }) }, error:function(){ alert("请求数据发生错误") } }) })})