新手村常驻居民 2021-11-24 13:39 采纳率: 17.3%
浏览 91
已结题

通过js遍历的table,如何实现最后一行实现求每行的总数数展示在在下面

img


<body>
<div>
<form onsubmit="return false">

    <table>
        <tr>
            <td>     <label style="width: 20%;">当期开始时间</label>
                <input type="Date" name="shijiantou" ></input> </td>
            <td>     <label style="width: 20%;">结束开始时间</label>
                <input type="Date" name="shijianwei" ></input> </td>
            <td>
                <label style="width: 25%;">选择当期日均比</label>
                <input type="text" class="layui-input" id="tianshu">
            </td>
        </tr>
        <tr>
            <td>     <label style="width: 20%;">当期开始时间</label>
                <input type="Date" name="stateOfLastPeriod" ></input> </td>
            <td>     <label style="width: 20%;">结束开始时间</label>
                <input type="Date" name="endOfLastPeriod" ></input> </td>
            <td>
                <label style="width: 25%;">选择当期日均比</label>
                <input type="text" class="layui-input" id="LastPeriod">
            </td>
            <td>
                <button type="submit"
                        onclick="abc()">点击按钮</button></td>
        </tr>
    </table>

</form>
</div>
<table id="guishutable"  style="width: 70%; border: 1px solid red">
</table>
<script src="../jquery-3.4.1/jquery-3.4.1.min.js"></script>
<script>



    function abc() {
        var jis=document.getElementById("tianshu").value;
        var LastPeriod=document.getElementById("LastPeriod").value;

        alert("123");
        $.ajax({
            url: "/zd/zongshu",
            type: "POST",
           data:{
               shijiantou :$('#ShiJianTou').val(),
               shijianwei:$('#ShiJianWei').val(),
               stateOfLastPeriod:$('#stateOfLastPeriod').val(),
               endOfLastPeriod:$('#endOfLastPeriod').val()

            },
            success: function (data){
                $("#guishutable").html("");
                $("#guishutable").append("<tr><td>名称</td><td>量</td><td>环比</td>" +
                                         "<td>上期量</td><td>s上期异量</td><td>上期环比</td>" +
                    "</tr>")
                $.each(data, function (i,gui){
                    console.log(JSON.stringify(gui))
                    $("#guishutable").append("<tr>" +
                        "<td style='width: 200px;border: 1px solid black;'>"+gui.name+"</td>" +
                        "<td  style='width: 200px;border: 1px solid black;'>"+gui.currentCount+"</td>" +
                        "<td  style='width: 200px;border: 1px solid black;'>"+(gui.currentCount/jis)+"</td>" +
                        "<td  style='width: 200px;border: 1px solid black;'>"+gui.lastCount+"</td>" +
                        "<td  style='width: 200px;border: 1px solid black;'>"+(gui.lastCount/LastPeriod)+"</td>" +
                        "<td  class='abcde' style='width: 200px;border: 1px solid black;'>"+(((gui.currentCount/jis)-(gui.lastCount/LastPeriod))/(gui.lastCount/LastPeriod))+"</td></tr>" );
                });

            }
        });
    }

</script>

</body>
  • 写回答

2条回答 默认 最新

  • 风雪一更 2021-11-24 14:08
    关注
    
    success: function (data){
                    $("#guishutable").html("");
                    $("#guishutable").append("<tr><td>名称</td><td></td><td>环比</td>" +
                                             "<td>上期量</td><td>s上期异量</td><td>上期环比</td>" +
                        "</tr>")
                    var total = 0,total_last=0;
                    $.each(data, function (i,gui){
                        total+=gui.currentCount;
                        total_last+=gui.lastCount;
                        $("#guishutable").append("<tr>" +
                            "<td style='width: 200px;border: 1px solid black;'>"+gui.name+"</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'>"+gui.currentCount+"</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'>"+(gui.currentCount/jis)+"</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'>"+gui.lastCount+"</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'>"+(gui.lastCount/LastPeriod)+"</td>" +
                            "<td  class='abcde' style='width: 200px;border: 1px solid black;'>"+(((gui.currentCount/jis)-(gui.lastCount/LastPeriod))/(gui.lastCount/LastPeriod))+"</td></tr>" );
                    });
                $("#guishutable").append("<tr>" +
                            "<td style='width: 200px;border: 1px solid black;'>合计</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'>"+total+"</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'></td>" +
                            "<td  style='width: 200px;border: 1px solid black;'>"+total_last+"</td>" +
                            "<td  style='width: 200px;border: 1px solid black;'></td>" +
                            "<td  class='abcde' style='width: 200px;border: 1px solid black;'></td></tr>" );
                    });
                }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 11月24日
  • 已采纳回答 11月24日
  • 修改了问题 11月24日
  • 修改了问题 11月24日
  • 展开全部

悬赏问题

  • ¥15 一个服务器已经有一个系统了如果用usb再装一个系统,原来的系统会被覆盖掉吗
  • ¥15 使用esm_msa1_t12_100M_UR50S蛋白质语言模型进行零样本预测时,终端显示出了sequence handled的进度条,但是并不出结果就自动终止回到命令提示行了是怎么回事:
  • ¥15 前置放大电路与功率放大电路相连放大倍数出现问题
  • ¥30 关于<main>标签页面跳转的问题
  • ¥80 部署运行web自动化项目
  • ¥15 腾讯云如何建立同一个项目中物模型之间的联系
  • ¥30 VMware 云桌面水印如何添加
  • ¥15 用ns3仿真出5G核心网网元
  • ¥15 matlab答疑 关于海上风电的爬坡事件检测
  • ¥88 python部署量化回测异常问题