在html中合計javascript總數

Question

當我按提交順序將購買數量和訂單總額添加到每日總額時，它最初可以正常工作，但在按下後每次只是不斷增加0.1後按下時。我有一個重置按鈕，將dailyTotal設置回0，我只需要幫助讓按鈕在按下訂單後實際上連續添加到總數中。任何幫助將是驚人的

//set base fee and dailyTotal 
     var fee = 1.00; 
     var dailyTotal = 0.00; 
     var dailyTotalElement = document.getElementById("dailyTotal"); 

     //printing of order price/quantity 
     function calculatePrice() 
      { 
      //convert input into *Element variable 
      var cappuccinoElement = document.getElementById("quantityCappuccino"); 
      var espressoElement = document.getElementById("quantityEspresso"); 
      var latteElement = document.getElementById("quantityLatte"); 
      var icedElement = document.getElementById("quantityIced"); 
      var orderTotalElement = document.getElementById("orderTotal"); 

      //set base prices 
      var cappuccino = 3.00; 
      var espresso = 2.25; 
      var latte = 2.50; 
      var iced = 2.50; 

      //turn *Element variable into quantity* value 
      var quantityCappuccino = cappuccinoElement.value; 
      var quantityEspresso = espressoElement.value; 
      var quantityLatte = latteElement.value; 
      var quantityIced = icedElement.value; 

      //calculate the cost 
      var total = fee * (
          (quantityCappuccino * cappuccino) + (quantityEspresso * espresso) + (quantityLatte * latte) + (quantityIced * iced) 
         ); 

      //printing of orderTotal cost (2 decimals) 
      orderTotalElement.value = parseFloat(total).toFixed(2); 
     } 

     //send order to daily totals 
     function placeOrder() 
      { 
      //convert input into *Element variable 
      var cappuccinoTotalElement = document.getElementById("totalCappuccino"); 
      var espressoTotalElement = document.getElementById("totalEspresso"); 
      var latteTotalElement = document.getElementById("totalLatte"); 
      var icedTotalElement = document.getElementById("totalIced"); 
      var dailyTotalElement = document.getElementById("dailyTotal"); 


      //set base totals 
      var totalCappuccino = 0; 
      var totalEspresso = 0; 
      var totalLatte = 0; 
      var totalIced = 0; 

      //turn *Element variable into total* value 
      var totalCappuccino = cappuccinoTotalElement.value; 
      var totalEspresso = espressoTotalElement.value; 
      var totalLatte = latteTotalElement.value; 
      var totalIced = icedTotalElement.value; 

      //add to the dailyTotal 
      var dailyTotal = (dailyTotalElement.value += document.getElementById("orderTotal").value); 
      var totalCappuccino = (cappuccinoTotalElement.value + document.getElementById("quantityCappuccino").value); 
      var totalEspresso = (espressoTotalElement.value + document.getElementById("quantityEspresso").value); 
      var totalLatte = (latteTotalElement.value + document.getElementById("quantityLatte").value); 
      var totalIced = (icedTotalElement.value + document.getElementById("quantityIced").value); 

      //printing of dailyTotal cost (2 decimals) 
      dailyTotalElement.value = parseFloat(dailyTotal).toFixed(2); 
     } 

     //resetting inputs and outputs 
     function clearTotal() 
      { 
      document.getElementById("orderTotal").value=0.00; 
      document.getElementById("orderTotalReceipt").value=0.00; 
      document.getElementById("quantityCappuccino").value=0; 
      document.getElementById("quantityEspresso").value=0; 
      document.getElementById("quantityLatte").value=0; 
      document.getElementById("quantityIced").value=0; 
      document.getElementById("takeawayYes").reset(); 
     } 

     //resetting daily totals to start new day 
     function endOfDay() 
      { 
      document.getElementById("dailyTotal").value=0.00; 
      document.getElementById("totalCappuccino").value=0; 
      document.getElementById("totalEspresso").value=0; 
      document.getElementById("totalLatte").value=0; 
      document.getElementById("totalIced").value=0; 
     } 

     //takeaway yes/no 
     function feeIncur(chk_bx) 
      { 
      //check box ticked/unticked 
      if(chk_bx.checked) 
       { 
       fee = 1.05; 
      } 
      else 
       { 
       fee = 1.00; 
      } 
     } 

     //disallow negative number input 
     var number = document.getElementsByName('number'); 
     number.onkeydown = function(e) 
      { 
      if(!((e.keyCode > 95 && e.keyCode < 106) 
      || (e.keyCode > 47 && e.keyCode < 58) 
      || e.keyCode == 8)) 
      { 
       return false; 
      } 
     } 

這裏是用來放置順序

<table> 
     <tr align="center"> 
      <td>  
       Hot Drinks 
      </td> 
      <td> 
       Price 
      </td> 
      <td> 
       Quantity 
      </td> 
     </tr> 
     <tr> 
      <form name="coffeeorder" id="coffeeorder"> 
      <td> 
       Cappuccino 
      </td> 
      <td align="center"> 
       $3.00 
      </td> 
      <td align="center"> 
       <input type="number" id="quantityCappuccino" name="number" value="0" min="0" max="20" onchange="calculatePrice()"> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Espresso 
      </td> 
      <td align="center"> 
       $2.25 
      </td> 
      <td align="center"> 
       <input type="number" id="quantityEspresso" name="number" value="0" min="0" max="20" onchange="calculatePrice()"> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Latte 
      </td> 
      <td align="center"> 
       $2.50 
      </td> 
      <td align="center"> 
       <input type="number" id="quantityLatte" name="number" value="0" min="0" max="20" onchange="calculatePrice()"> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       Iced Coffee 
      </td> 
      <td align="center"> 
       $2.50 
      </td> 
      <td align="center"> 
       <input type="number" id="quantityIced" name="number" value="0" min="0" max="20" onchange="calculatePrice()"> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <input type="checkbox" id="takeawayYes" value="1" onchange="feeIncur(this); calculatePrice();">Takeaway? 
      </td> 
      <td> 
       (5% fee incurs) 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <button type="reset" onclick="clearTotal();">New Order</button> 
      </td> 
      <td> 
       Order total: <b>$</b> 
       <input type="text" name="orderTotal" id="orderTotal" Size=6 readonly value="0.00"> 
      </td> 
     </tr> 
      </form> 
     <tr> 
      <td> 
       <button type="button" onclick="placeOrder();">Place Order</button> 
      </td> 
     </tr> 
    </table> 

而且這裏的形式和輸入的HTML是用來相符的總數的代碼。

<table> 
    <tr> 
     <td> 
      <div class="left"> 
       CAPPUCCINO 
      </div> 
      <div class="right"> 
       x 
       <input type="text" name="totalCappuccino" id="totalCappuccino" Size=2 readonly value="0"> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div class="left"> 
       ESPRESSO 
      </div> 
      <div class="right"> 
       x 
       <input type="text" name="totalEspresso" id="totalEspresso" Size=2 readonly value="0"> 
      </div> 
      </td> 
    </tr> 
    <tr> 
     <td> 
      <div class="left"> 
       LATTE 
      </div> 
      <div class="right"> 
       x 
       <input type="text" name="totalLatte" id="totalLatte" Size=2 readonly value="0"> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div class="left"> 
       ICED COFFEE 
      </div> 
      <div class="right"> 
       x 
       <input type="text" name="totalIced" id="totalIced" Size=2 readonly value="0"> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div class="left"> 
       DAILY TOTAL: 
      </div> 
      <div class="right"> 
       <input type="text" name="dailyTotal" id="dailyTotal" Size=10 readonly value="0.00"> 
      </div> 
     </td> 
    </tr> 
</table> 
<table> 
    <tr> 
     <td> 
      <div align="center"> 
       <button type="button" onclick="endOfDay();">Run end of day</button> 
      </div> 
     </td> 
    </tr> 
</table> 

Answer 1

剛剛嘗試用下述替換您的placeOrder功能：

function placeOrder() { 
    var orderTotalElement = document.getElementById("orderTotal"); 
    var countTotal = parseFloat(orderTotalElement.value); 
    dailyTotal+= countTotal; 
    dailyTotalElement.value = dailyTotal; 
} 

希望它能幫助:)