Javascript計算動態不提交按鈕

我從數據庫中拉取項目，取出成本和用戶定義的數量並顯示總計。我的目標是用戶可以計算25行以上的耗材，並在最後添加總計。我在計算成本*數量時無法刷新頁面並丟失所有其他數據。我相當新的JavaScript，我不明白爲什麼這不適合我。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>

來源

2015-04-22 bWF800

從簡單的閱讀，看來你要覆蓋每個輸入場總，所以一旦你改變了第二個輸入字段，刪除以前的值 – Patrick

什麼是'document.getElementsByid（）'？ –

另外好點，它是document.getElementById（）。區分大小寫。 –

你不及格字符串元素的ID值，以你的函數：

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

你應該總是有你的瀏覽器開發者控制檯打開，這樣就可以檢查錯誤。

也爲一些評論所指出的，這是getElementById()，用「元素」單數。

來源

2015-04-22 21:57:12 Pointy

確實如此，也有助於開發人員。控制檯打開，因爲然後這將跳出你的權利。 –

Javascript計算動態不提交按鈕

回答

相關問題