Javascript动态计算，无需提交按钮

我从数据库中提取一个项目，获取成本和用户定义的数量，并显示总数。我的目标是拥有25+行的供应品，用户可以计算并在最后加总。在不刷新页面和丢失所有其他数据的情况下，我无法计算成本*数量。我对javascript相当陌生，我不明白为什么这对我不起作用

<script type="text/javascript">
function updatesum(cost, quant, tot) {
    var qty = document.getElementsByid(quant).value;
    var price = document.getElementsByid(cost).value;
    document.getElementById(tot).value = (price * qty);

}
</script>

<cfoutput>
<cfform>
    <table>
        <tr>
        <td colspan=3>Supplies</td>
        </tr>
        <tr>
        <td>Date</td>
        <td>Supply</td>
        <td>Cost</td>
        <td>Quantity</td>
        <td>Total</td>
        </tr>
        <tr>
        <td><cfinput type="datefield" name="date_01" id="date_01"></td>
        <td><cfselect name="supply_01" onChange="">
                <option value="0"></option>
            <cfloop query="supplies">
                <option value="#supplies.id#">#supplies.supply#</option>
            </cfloop>
            </cfselect></td>
        <td><cfinput type="integer" name="unitCost_01" id="unitCost_01" value="" onChange="updatesum(unitCost_01, quantity_01, total_01"></td>
        <td><cfinput type="integer" name="quantity_01" id="quantity_01" onChange="updatesum(unitCost_01, quantity_01, total_01)"></td>
        <td><cfinput type="integer" readonly="yes" name="total_01" id="total_01" value=""></td>
        </tr>
    </table>
</cfform>  
</cfoutput>  

函数更新SUM（成本、数量、tot）{
var数量=document.getElementsByid（quant）.value；
var price=document.getElementsByid（成本）.value；
document.getElementById（tot）.value=（价格*数量）；
}
补给
日期
供给
成本
量
全部的
#供应#

您没有将字符串元素id值传递给函数：

    <td><cfinput type="integer" name="unitCost_01" id="unitCost_01" value="" onChange="updatesum('unitCost_01', 'quantity_01', 'total_01'"></td>

您应该始终打开浏览器开发人员控制台，以便检查错误

---

另外，正如一些评论所指出的，它是

getElementById（）

，带有“Element”单数。

从简单的阅读中，似乎您正在覆盖每个输入字段的总数，因此，一旦更改第二个输入字段，您就删除了以前的值what is

document.getElementsByid（）

？同样好的一点是，它是document.getElementById（）. 区分大小写。再次检查-你做对了一次，错了两次。回答这个问题太快了。是的，打开开发控制台也会有帮助，因为那样的话，这个问题会直接跳到你身上。