首页 > 解决方案 > 计算php表内的总价

问题描述

我正在尝试在表格中显示总价。

我有 2 个数组,其中一个是汽车的名称,第二个是每辆汽车的价格。

我已经设法在表格中显示价格和名称,但问题是我有一个“复选框”的东西,可以显示汽车是否已售出......

我正在尝试进行总计算来计算所有选中复选框的总价格。

这意味着 - 当复选框打开时,总价格变量应该将该汽车的价格添加到其中。

它应该是这样的: 表格示例

我必须提到我刚刚开始学习php拼贴,这里是数组和变量:

<?php  
    $cars = array ("ford","fiat","renault","mazda");
    $prices = array(100,80,90,120);
    $sold = '<input type="checkbox" name="sold">';
?>

我为我的表添加了基本style信息(在同一个php文件中)

<style>

    table {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
    }

    td, th {
        border: 1px solid #dddddd;
        text-align: center;
        padding: 8px;``
    }
</style>

php表格的代码:

<?php  
    $cars = array ("ford","fiat","renault","mazda");
    $prices = array(100,80,90,120);
    $sold = '<input type="checkbox" name="sold">';
?>

<h1>list of cars</h1>
<table>
    <th>name</th>
    <th>price</th>
    <th>sold</th>
     <?php
        for($i=0;$i<count($cars);$i++){
            echo 
            "<tr>
            <td>$cars[$i]</td>.
            <td>$prices[$i]$</td>.
            <td>$sold</td>.
            </tr>";
        }
    ?>
</table>

如何计算所有选中复选框价格的数量?

标签: phphtmlcss

解决方案


我会修改复选框以将价格作为数据属性包含在内,并将其放在 for 循环中而不是在它之外。

$sold = '<input type="checkbox" data-price="$prices[$i]" name="sold">';

然后在javascript中,只需循环检查复选框和检查检查的事件侦听器。

 function showTotal(els) {
  total = 0;
  els.forEach(function(el) {
    if (el.checked) {
      total += +el.getAttribute("data-price");
    }
  });

  document.querySelector("#total").innerHTML = "$" + total.toFixed(2)
}

sold = document.querySelectorAll("[name='sold']");

sold.forEach(function(el) {
  el.addEventListener("change", function(ev) {
    showTotal(sold)
  });
});

要显示总数,您需要一个 div 来保存总数

<div id="total"></div>

推荐阅读