자바 스크립트 "onchange"로 더하기 및 빼기

도움이 될 것입니다. 소수점이 포함 된 onChange 명령을 사용하여 JavaScript 필드를 추가 할 예정이지만 onChange 명령을 숫자 (예 : 1.7)를 제거하는 옵션 "NO"로 다시 이동하면 1.69999는 제거되고 1.7은 제거되지 않습니다.자바 스크립트 "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()는 진수 바이너리에서 갈 때 정확한 변환 결코없는 이중으로 변환됩니다. 필요에 따라 toFixed()를 사용하여 출력을 자르거나 을 사용하는 것이 좋습니다.

은 다음을 참조하십시오

또한, 변환이 정확하지 바로 그 이유 때문에이 경우 다음 총에 값을 추가 밖으로 다시 뺄 나쁜 관행입니다 - 반올림 오류가 축적 될 것이다 방법. 그 중 하나가 변경 될 때마다 포함 된 값의 합계를 얻는 것이 좋습니다.

<!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>

편집 : 당신이 할 수 jQuery를 사용하여 위의 코드는 입력 필드의 값이 숫자 "입니다"또는하지 않을 경우 보정된다. 이 경우 parseInt()의 NaN 결과와 반대로 0 값이 사용됩니다.

출처

2013-03-23 23:50:27 Nolo

감사합니다. 한 가지 더 질문합니다. 값을 변경하려면 어떻게해야합니까? 예를 들어 1.7을 value = ""로 변경하고 value = "19.3"을 value = ""로 변경합니다. 이렇게하면 페이지로 이동하여 값을 추가하여 NaN을 얻습니다. 그걸 도와 주실 수 있겠습니까? – Adder

@Adder : 페이지에서 값을 추출하는 방법에주의하십시오. value = "", parseInt ("")가 (정의되지 않음) 일 때 NaN이 나오는 곳이 될 수 있습니다. 숫자 값으로 작업 할 때는 "0"을 사용하거나 변환하기 전에 확인하십시오. – Nolo

자바 스크립트 "onchange"로 더하기 및 빼기

답변

관련 문제