Question

我正在做一个项目，包括进行估算并添加结果。我正在使用GET方法并使用url中的一些信息。我也使用WordPress来构建网页。问题是TOTAL列的总和不起作用并显示在我所做的TOTAL行中。不是错误，但我想我需要添加一段代码或更改javascript中的内容。那么为什么id：＆＃34; total＆＃34;没有显示整列的总和？是total.value错了吗？是id：＆＃34; system_total＆＃34;有问题吗？

以下是HTML的外观：

 <form >
<h2>Cotizacion</h2>
<table class="Cotization">
  <tbody>
    <tr>
      <th style="width:25%;font-size:16px;text-align:center;">Description</th>
      <th style="width:15%;" class="qtyhd" title="qtytt">Qty</th>
      <th style="width:15%;" class="ratehd" title="ratett">Rate</th>
      <th style="width:15%;" class="tlhd" title="totaltt">Total</th>
    </tr>
    <tr>
      <td>PV Grid Tied System</td>
      <td> <input id="system_qty" name="system_qty" value="1" type="number" /></td>
      <td> <input id="system_rate" name="system_rate" value="0" type="number" /></td>
      <td> <output id="system_total">  </output></td>
    </tr>
    <tr>
      <td>Solar Modules 250w</td>
      <td> <input id="modules_qty" name="modules_qty" value="0" type="number" /></td>
      <td> <input id="modules_rate" name="modules_rate" value="0" type="number" /></td>
      <td> <output id="modules_total">  </output></td>
    </tr>
    <tr>
      <td>Inverter</td>
      <td> <input id="inverter_qty" name="inverter_qty" value="1" type="number" /></td>
      <td> <input id="inverter_rate" name="inverter_rate" value="0" type="number" /></td>
      <td> <output id="inverter_total"> </output></td>
    </tr>
    <tr>
      <td>Aluminum Fames</td>
      <td> <input id="aluminum_qty" name="aluminum_qty" value="0" type="number" /></td>
      <td> <input id="aluminum_rate" name="aluminum_rate" value="0" type="number" /></td>
      <td> <output id="aluminum_total">  </output></td>
    </tr>
    <tr>
      <td>Service Disconnect</td>
      <td> <input id="servicedt_qty" name="servicedt_qty" value="1" type="number" /></td>
      <td> <input id="servicedt_rate" name="servicedt_rate" value="0" type="number" /></td>
      <td> <output id="servicedt_total"> </output></td>
    </tr>
    <tr>
      <td>Installation</td>
      <td> <input id="installation_qty" name="installation_qty" value="1" type="number" /></td>
      <td> <input id="installation_rate" name="installation_rate" value="0" type="number" /></td>
      <td> <output id="installation_total">  </output></td>
    </tr>
    <tr>
      <td>Down Payment</td>
      <td> <input id="dnpayment_qty" name="dnpayment_qty" value="-1" type="number" /></td>
      <td> <input id="dnpayment_rate" name="dnpayment_rate" value="0" type="number" /></td>
      <td> <output id="dnpayment_total">  </output></td>
   </tr>
    <tr>
      <td>Total </td>
      <td> </td>
      <td> </td>
      <td> <input id="total" name="total"/></td>
   </tr>
  </tbody>
</table>
</form>

以下是可能存在问题的JavaScript：

<script>
document.addEventListener('DOMContentLoaded', function () {
    var system_size = Number(getParameterByName('system_size'));
  var system_rate_input = document.getElementById('system_rate');
    var modules_qty = document.getElementById('modules_qty');
  var aluminum_qty = document.getElementById('aluminum_qty');
  var systemTotal = Number(document.getElementById('system_total').innerText);
  var moduleTotal = Number(document.getElementById('modules_total').innerText);
  var inverterTotal = Number(document.getElementById('inverter_total').innerText);
  var aluminumTotal = Number(document.getElementById('aluminum_total').innerText);
  var servicedtTotal = Number(document.getElementById('servicedt_total').innerText);
  var installationTotal = Number(document.getElementById('installation_total').innerText);
  var dnpaymentTotal = Number(document.getElementById('dnpayment_total').innerText);
  var total = document.getElementById('total');
  modules_qty.value = Number(system_size) * 4;
  aluminum_qty.value = Number(modules_qty.value);
  system_rate_input.value = 2.9 * 1000 * 1.2 * system_size;
  updateSystemTotal()
  updateModulesTotal()
  updateInverterTotal()
  updateAluminumTotal()
  updateServiceTotal()
  updateInstallationTotal()
  updateDownPaymentTotal()
  total.value = Number(systemTotal) + Number(moduleTotal) + Number(inverterTotal) + Number(aluminumTotal) + Number(servicedtTotal) + Number(installationTotal) + Number(dnpaymentTotal);
})

// FIRST ROW

function updateSystemTotal() {
    var output = document.getElementById('system_total');
  var quantity = Number(document.getElementById('system_qty').value);
  var system_rate = Number(document.getElementById('system_rate').value);
  output.innerText = quantity * system_rate;
}

document.getElementById('system_rate').addEventListener('change', updateSystemTotal)

document.getElementById('system_qty').addEventListener('change', updateSystemTotal)

// Second ROW

function updateModulesTotal() {
    var output = document.getElementById('modules_total');
  var quantity = Number(document.getElementById('modules_qty').value);
  var modules_rate = Number(document.getElementById('modules_rate').value);
  output.innerText = quantity * modules_rate;
}

document.getElementById('modules_rate').addEventListener('change', updateModulesTotal)

document.getElementById('modules_qty').addEventListener('change', updateModulesTotal)

// Third ROW

function updateInverterTotal() {
    var output = document.getElementById('inverter_total');
  var quantity = Number(document.getElementById('inverter_qty').value);
  var inverter_rate = Number(document.getElementById('inverter_rate').value);
  output.innerText = quantity * inverter_rate;
}

document.getElementById('inverter_rate').addEventListener('change', updateInverterTotal)

document.getElementById('inverter_qty').addEventListener('change', updateInverterTotal)

// Fourth ROW

function updateAluminumTotal() {
    var output = document.getElementById('aluminum_total');
  var quantity = Number(document.getElementById('aluminum_qty').value);
  var aluminum_rate = Number(document.getElementById('aluminum_rate').value);
  output.innerText = quantity * aluminum_rate;
}

document.getElementById('aluminum_rate').addEventListener('change', updateAluminumTotal)

document.getElementById('aluminum_qty').addEventListener('change', updateAluminumTotal)

// Fith ROW

function updateServiceTotal() {
    var output = document.getElementById('servicedt_total');
  var quantity = Number(document.getElementById('servicedt_qty').value);
  var servicedt_rate = Number(document.getElementById('servicedt_rate').value);
  output.innerText = quantity * servicedt_rate;
}
document.getElementById('servicedt_rate').addEventListener('change', updateServiceTotal)

document.getElementById('servicedt_qty').addEventListener('change', updateServiceTotal)
// Six ROW

function updateInstallationTotal() {
    var output = document.getElementById('installation_total');
  var quantity = Number(document.getElementById('installation_qty').value);
  var installation_rate = Number(document.getElementById('installation_rate').value);
  output.innerText = quantity * installation_rate;
}
document.getElementById('installation_rate').addEventListener('change', updateInstallationTotal)

document.getElementById('installation_qty').addEventListener('change', updateInstallationTotal)

//Seventh ROW

function updateDownPaymentTotal() {
    var output = document.getElementById('dnpayment_total');
  var quantity = Number(document.getElementById('dnpayment_qty').value);
  var dnpayment_rate = Number(document.getElementById('dnpayment_rate').value);
  output.innerText = quantity * dtpayment_rate;
}
document.getElementById('dnpayment_rate').addEventListener('change', updateDownPaymentTotal)

document.getElementById('dnpayment_qty').addEventListener('change', updateDownPaymentTotal)

// DON't TOUCH ANYTHING BELOW THIS POINT!!!

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
</script>

Answer 1

var systemTotal = Number(document.getElementById('system').innerText);

您提供的代码段中没有名为“system”的元素。您确定不需要从“system_total”获取值吗？

修改

总计在开头显示0，因为小计未初始化。要解决此问题，您可以在计算总数之前使用更新功能。

document.addEventListener('DOMContentLoaded', function () { var system_size = Number(getParameterByName('system_size')); var system_rate_input = document.getElementById('system_rate'); var modules_qty = document.getElementById('modules_qty'); var aluminum_qty = document.getElementById('aluminum_qty'); var total = document.getElementById('total'); modules_qty.value = Number(system_size) * 4; aluminum_qty.value = Number(modules_qty.value); system_rate_input.value = 2.9 * 1000 * 1.2 * system_size; updateSystemTotal(); updateModulesTotal(); updateInverterTotal(); updateAluminumTotal(); updateServiceTotal(); updateInstallationTotal(); updateDownPaymentTotal(); updateTotal(); }) function updateTotal() { var total = document.getElementById('total'); var systemTotal = Number(document.getElementById('system_total').innerText); var moduleTotal = Number(document.getElementById('modules_total').innerText); var inverterTotal = Number(document.getElementById('inverter_total').innerText); var aluminumTotal = Number(document.getElementById('aluminum_total').innerText); var servicedtTotal = Number(document.getElementById('servicedt_total').innerText); var installationTotal = Number(document.getElementById('installation_total').innerText); var dnpaymentTotal = Number(document.getElementById('dnpayment_total').innerText); total.value = Number(systemTotal) + Number(moduleTotal) + Number(inverterTotal) + Number(aluminumTotal) + Number(servicedtTotal) + Number(installationTotal) + Number(dnpaymentTotal); }

此外，您只要在用户编辑数量或费率时更新小计，但您没有更新“总计”值。您可以在自己的更新函数中调用updateTotal()来解决此问题：

function updateSystemTotal() { var output = document.getElementById('system_total'); var quantity = Number(document.getElementById('system_qty').value); var system_rate = Number(document.getElementById('system_rate').value); output.innerText = quantity * system_rate; updateTotal(); }

Answer 2

复制我的代码并运行它：

javascript（1.js）：

＆＃13;

ldLibs

＆＃13;

function rr() {
                 var system_size = document.getElementById('system_qty').value;
                 var system_rate_input = document.getElementById('system_rate').value;
                 var modules_qty = document.getElementById('modules_qty').value;
                 var modules_rate = document.getElementById('modules_rate').value;
                 var inverter_qty = document.getElementById('inverter_qty').value;
                 var inverter_rate = document.getElementById('inverter_rate').value;
                 var aluminum_qty = document.getElementById('aluminum_qty').value;
                 var aluminum_rate = document.getElementById('aluminum_rate').value;
                 var servicedt_qty = document.getElementById('servicedt_qty').value;
                 var servicedt_rate = document.getElementById('servicedt_rate').value;
                 var installation_qty = document.getElementById('installation_qty').value;
                 var installation_rate = document.getElementById('installation_rate').value;
                 var dnpayment_qty = document.getElementById('dnpayment_qty').value;
                 var dnpayment_rate = document.getElementById('dnpayment_rate').value;
                
                  var systemTotal = system_size * system_rate_input;
                  document.getElementById('system_total').innerHTML = systemTotal;
                  var moduleTotal = modules_rate  * modules_qty;
                  document.getElementById('modules_total').innerHTML = moduleTotal;
                  var inverterTotal = inverter_qty * inverter_rate;
                  document.getElementById('inverter_total').innerHTML = inverterTotal;
                  var aluminumTotal =aluminum_qty * aluminum_rate;
                   document.getElementById('aluminum_total').innerHTML = aluminumTotal;
                  var servicedtTotal = servicedt_qty * servicedt_rate;
                  document.getElementById('servicedt_total').innerHTML = servicedtTotal;
                  var installationTotal = installation_qty * installation_rate;
                  document.getElementById('installation_total').innerHTML = installationTotal;
                  var dnpaymentTotal = dnpayment_qty * dnpayment_rate;
                   document.getElementById('dnpayment_total').innerHTML = dnpaymentTotal;
                  var Total = document.getElementById('total');
                  aluminum_qty = system_size * 4;
                  system_rate_input = 2.9 * 1000 * 1.2 * system_size;
                  Total.value = systemTotal + moduleTotal + inverterTotal+ aluminumTotal + servicedtTotal+ installationTotal + dnpaymentTotal;
}

＆＃13;

为什么最后一行的总数不计算总和？

2 个答案: