html内でjavascriptの合計を集計

Question

私は注文量を注文し、注文合計を1日の合計に加算すると、最初は動作しますが、押した後は、押した後毎回0.1を続けて追加します。私は毎日の合計を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; 
} 

はそれが役に立てば幸い:)