用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”

回答

相关问题