PHP真实的动态计算mysql结果的总和

zbdgwd5y  于 2023-02-21  发布在  PHP
关注(0)|答案(3)|浏览(123)

如何使用html或php或javascript或css将表TD计算为总数?
示例

<table>
<tr><td> 1000 </td></tr>
<tr><td> 2000 </td></tr>
<tr><td> 3000 </td></tr>

<tr><td> TOTAL 6000 </td></tr>

</table>
6ovsh4lw

6ovsh4lw1#

所以先把表存入内存,然后输出总数。

while(... fetch from db ... ) {
   $html = '... table row ..';
   $total += $row['cost'];
}

echo 'Total: ' . $total;
echo $html; // output table contents
wgeznvg7

wgeznvg72#

只是为了好玩:您 * 可以 * 保持输出原样(至少是顺序,即首先输出项,然后输出总计/总和),然后通过将box-ordinal-group设置为相反顺序来更改元素在浏览器呈现中的位置/顺序。

<!DOCTYPE html>
<html>
    <head>
        <title>...</title>
        <style>
            #container {
                display: -webkit-box;
                display: -moz-box;
                display: box;

                -webkit-box-orient: vertical;
                -moz-box-orient: vertical;
                box-orient: vertical;
            }

            #total {
                -webkit-box-ordinal-group: 1;
                -moz-box-ordinal-group: 1;
                box-ordinal-group: 1;
            }

            #items {
                -webkit-box-ordinal-group: 2;
                -moz-box-ordinal-group: 2;
                box-ordinal-group: 2;
            }
        </style>
    </head>
    <body>
        <div id="container">
            <div id="items"><!-- though it's before #total in the document -->
                <ul><li>a</li><li>b</li><li>c</li><li>d</li><li>e</li></ul>
            </div>
            <div id="total"><!-- #total will be rendered above #items  ...if flexible boxing is supported -->
                1234
            </div>
        </div>
    </body>
</html>
gxwragnw

gxwragnw3#

我认为@Marc B的答案是你问题标题的更好答案。
如果您希望MySQL数据库的更新实时推送到您的Web页面,则是另一个问题-请查看Rachet Web Sockets for PHP
如果你想要一个javascript的解决方案,只是计算你的总数...
HTML:将相同的类名添加到每个非总计表单元格中。

<tr><td class="amt"> 3000 </td></tr>

在"total"单元格中添加一个带有id的范围。

<tr><td>TOTAL <span id="total">...</span></td></tr>

此时将显示Javascript:
获取所有"amt"细胞的HTMLCollection

const amounts = document.querySelectorAll('.amt');

获取对"total"单元格的引用

const total_cell = document.querySelector('#total');

声明一个变量来保存计算。

Let total = 0;

循环遍历金额,获取每个单元格的内容作为Number,并将该数字添加到"total"的值中。

for (const amt of amounts) {
 const number = Number(amt.innerText);
 total += number;
}

然后更新"总计"单元格

total_cell.innerText = total;

整个事情...

const amounts = document.querySelectorAll('.amt');
const total_cell = document.querySelector('#total');
let total = 0;
for (const amt of amounts) {
  const number = Number(amt.innerText);
  total += number;
}
total_cell.innerText = total;
<table>
  <tr><td class="amt"> 1000 </td></tr>
  <tr><td class="amt"> 2000 </td></tr>
  <tr><td class="amt"> 3000 </td></tr>
  <tr><td>TOTAL <span id="total">...</span></td></tr>
</table>

相关问题