0

どんな助けでも大歓迎です。10 進数を含む onChange コマンドを使用して JavaScript フィールドを追加していますが、onChange コマンドをオプション「NO」に戻して数値を削除すると (例: 1.7)、1.69999 のみが削除され、1.7 は削除されません。

以下は、私が使用している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>
4

1 に答える 1

0

parseFloat() は double に変換していますが、これは 2 進数から 10 進数に変換するときに正確に変換されることはありません。必要に応じて、 toFixed() を使用して出力を切り捨てるか、ライブラリの decimal データ型を見つけることをお勧めします。

見る：

また、この場合、合計に値を加算してから減算することは、変換が正確ではないというまさにその理由から、悪い習慣です。丸め誤差がそのように蓄積されます。含まれる値のいずれかが変更されるたびに、それぞれの値の合計を取得することをお勧めします。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>

編集: 上記のコードは、入力フィールドの値が "" または数値ではない場合に修正されます。この場合、parseInt() の NaN の結果とは対照的に、値 0 が使用されます。

于 2013-03-23T23:50:27.073 に答える