用JavaScript添加和減法「onchange」

任何幫助將不勝感激。我使用帶小數點的onChange命令添加JavaScript字段，但是當onChange命令移回選項「NO」刪除數字時（例如1.7），它只會刪除1.69999而不是1.7。用JavaScript添加和減法「onchange」

下面是我使用的onChange代碼。

<div id="onewindow"> 
    <label for="txtoneside" class="editor-label"><strong>1 Side </strong></label> 
    <div align="right"> 
     <input type = "text" name = "txtoneside" id="txtoneside" value = "1.7" /> 
     <select name="txtoneside_slider" id="txtoneside_slider" data-role="slider" data-mini="true" onChange="javascript: if(this.value=='yes'){ document.getElementById('txtgrandtotal').value= parseFloat(document.getElementById('txtgrandtotal').value) + parseFloat(document.getElementById('txtoneside').value); calculate()} 
if(this.value=='no'){ document.getElementById('txtgrandtotal').value= parseFloat(document.getElementById('txtgrandtotal').value) - parseFloat(document.getElementById('txtoneside').value); calculate()}"/> 
     <option value="no">No</option> 
     <option value="yes">Yes</option> 
     </select> 
</div> 
<div id="twowindow"> 
    <label for="txtoneside" class="editor-label"><strong>2 Side </strong></label> 
<div align="right"> 
    <input type = "text" name = "txttwoside" id="txttwoside" value = "19.3" /> 
    <select name="txttwoside_slider" id="txttwoside_slider" data-role="slider" data-mini="true" onChange="javascript: if(this.value=='yes'){ document.getElementById('txtgrandtotal').value= parseFloat(document.getElementById('txtgrandtotal').value) + parseFloat(document.getElementById('txttwoside').value); calculate()} 
if(this.value=='no'){ document.getElementById('txtgrandtotal').value= parseFloat(document.getElementById('txtgrandtotal').value) - parseFloat(document.getElementById('txttwoside').value); calculate()}" /> 
     <option value="no">No</option> 
     <option value="yes">Yes</option> 
     </select> 
</div> 
<div id="grandtotal"> 
    <label for="txtgrandtotal" class="editor-label"><strong>JOB TOTAL</strong></label> 
    <div align="right"> 
    <input type = "text" name = "txtgrandtotal" id="txtgrandtotal" value = "0" /> 
    </div> 

</div>

來源

2013-03-23 Adder

parseFloat（）正在轉換爲double，從二進制轉換爲十進制時，它絕不是一個精確的轉換。我會建議使用toFixed（）來截斷輸出，或者根據您的需要使用find a library decimal data type。

看到：

而且，這是一個不好的做法，將值添加到總，然後減去其背出在這種情況下，出於某種原因，轉換是不精確的 - 舍入誤差將在積累辦法。我建議在任何時候對其中一個值進行更改時，對每個包含的值進行求和。通過使用jQuery你可以：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title>New Web Project</title> 
     <script src="jquery-1.9.1.min.js"></script> 
    </head> 
    <body> 
     <div id="onewindow"> 
      <label for="txtoneside" class="editor-label"><strong>1 Side </strong></label> 
      <div align="right"> 
       <input type="text" name="txtoneside" id="txtoneside" value = "1.7" /> 
       <select name="txtoneside_slider" id="txtoneside_slider" data-role="slider" data-mini="true" onChange="update()"/> 
        <option value="no">No</option> 
        <option value="yes">Yes</option> 
       </select> 
      </div> 
      <div id="twowindow"> 
       <label for="txtoneside" class="editor-label"><strong>2 Side </strong></label> 
       <div align="right"> 
      <input type = "text" name = "txttwoside" id="txttwoside" value = "19.3" /> 
        <select name="txttwoside_slider" id="txttwoside_slider" data-role="slider" data-mini="true" onChange="update()"/> 
         <option value="no">No</option> 
         <option value="yes">Yes</option> 
        </select> 
       </div> 
       <div id="grandtotal"> 
        <label for="txtgrandtotal" class="editor-label"><strong>JOB TOTAL</strong></label> 
        <div align="right"> 
         <input type = "text" name = "txtgrandtotal" id="txtgrandtotal" value = "0" /> 
        </div> 
       </div> 
      </div> 
     </div> 
     <script> 
      update = function(){ 
       var all_values = [], 
        sum = 0, 
        i = 0; 
       $('input:not(#txtgrandtotal)').each(function(){ 
        var val = parseFloat($(this).attr('value')); 
        all_values.push((isNaN(val)) ? 0 : val) // store each value 
       }); 
       $('select').each(function(){ 
        var $option = $(this).find(':selected'); 
        if($option.text()){ 
         if($option.text()==="Yes") 
          sum+=all_values[i]; // sum only the ones that are selected 
        } 
        ++i; 
       }); 
       $('#txtgrandtotal').attr('value', sum.toFixed(2)); 
       calculate(); // if that is required somewhere else in your code? 
      } 
     </script> 
    </body> 
</html>

編輯：上面的代碼是爲當輸入字段的值爲「」或者非數字校正。在這種情況下，使用值0而不是parseInt（）的NaN結果。

來源

2013-03-23 23:50:27 Nolo

謝謝Nolo。還有一個問題，如果我想改變這些值呢？示例將1.7更改爲value =「」，並將value =「19.3」更改爲value =「」當我這樣做時，轉到頁面並放入一個值以添加我得到的NaN。你能幫我解決嗎？ – Adder 2013-03-26 13:29:11

@Adder：小心如何從頁面中提取值 - 當value =「」時，parseInt（「」）是（未定義），這可能是NaN來自的地方。嘗試在使用數值時使用「0」，或在執行轉換之前檢查。 – Nolo 2013-03-26 20:16:09

用JavaScript添加和減法「onchange」

回答

相關問題