文本框的输出在计算上显示NaN

时间：2017-10-17 03:53:22

标签： javascript html

我的情况是要进行一些计算。我已经创建了几行公式来计算Calc()函数中的场景。

计算工作正常，但我遇到NaN输出问题。当我没有输入任何内容并单击Calculate按钮时，文本框会显示NaN的输出。我理解NaN表示不是数字，但我无法解决这个问题。

我希望输出0.00而不是NaN。需要帮助。

＆＃13;
＆＃13; 
function Calc() {
    let arr = document.getElementsByName('qty');
    let tot = 0;
    for (let i = 0; i < arr.length; i++) {
        let radios = document.getElementsByName("group" + (i + 1));
        for (let j = 0; j < radios.length; j++) {
            let radio = radios[j];
            if (radio.value == "Yes" && radio.checked) {
                tot += parseInt(arr[i].value);
            }
         }
    }

    document.getElementById('total').value = tot;
    var stdHour = ((tot * 1.15) / 3600);
    document.getElementById('stdHour').value = stdHour.toFixed(4);
    var earnHour = ((tot * 1.15) / 3600) * document.getElementById('unitNum').value;
    document.getElementById('earnHour').value = earnHour.toFixed(3);
    document.getElementById('hc').value = ((earnHour / 19.8) * document.getElementById('numDays').value).toFixed(3);
    var earnDays = ((document.getElementById('unitNum').value / ((document.getElementById('numHeadC').value / stdHour) * 6.6)) / 3);
    document.getElementById('days').value = earnDays.toFixed(3);
    document.getElementById('perday').value = ((document.getElementById('numHeadC').value / stdHour * 6.6) * 3).toFixed(1);
    document.getElementById('hcperday').value = ((document.getElementById('output').value / 19.8) * stdHour).toFixed(3);
}
＆＃13; 
<h3>
    <B>Extreme Temperature (Cold Temp)</B>
</h3>
<table class="table2" style="width:60%" align="center">
    <tr>
        <td></td>
        <td class="cent"><b>Value</b></td>
        <td class="cent"><b>Yes</b></td>
        <td class="cent"><b>No</b></td>
    </tr>

    <tr>
        <label id="group5">
            <td>ATE Labview RF Testing Extreme</td>
	        <td class="cent"><input type="text" value="153" align="center" name="qty" id="qty5" maxlength="6" size="4" readonly="readonly"/></td>
	        <td class="cent"><input type="radio" name="group5" value="Yes" checked="checked"></td>
          <td class="cent"><input type="radio" name="group5" value="No"></td>
        </label>
    </tr>

    <tr>
        <label id="group6">
            <td>User Interface Extreme</td>
	        <td class="cent"><input type="text" value="0" align="center" name="qty" id="qty6" maxlength="6" size="4" readonly="readonly"/></td>
	        <td class="cent"><input type="radio" name="group6" value="Yes"></td>
            <td class="cent"><input type="radio" name="group6" value="No" checked="checked"></td>
        </label>
    </tr>

    <tr>
        <label id="group7">
            <td>Mic Talk Internal Extreme</td>
	        <td class="cent"><input type="text" value="68" align="center" name="qty" id="qty7" maxlength="6" size="4" readonly="readonly"/></td>
	        <td class="cent"><input type="radio" name="group7" value="Yes" checked="checked"></td>
           <td class="cent"><input type="radio" name="group7" value="No"></td>
        </label>
    </tr>

    <tr>
         <label id="group8">
             <td>Mic Talk External Extreme</td>
	         <td class="cent"><input type="text" value="53" align="center" name="qty" id="qty8" maxlength="4" size="4" readonly="readonly"/></td>
	         <td class="cent"><input type="radio" name="group8" value="Yes" checked="checked"></td>
             <td class="cent"><input type="radio" name="group8" value="No"></td>
          </label>
     </tr>

     <tr>
         <label id="group9">
             <td>Desense Test</td>
	         <td class="cent"><input type="text" value="50" align="center" name="qty" id="qty9" maxlength="6" size="4" readonly="readonly"/></td>
	         <td class="cent"><input type="radio" name="group9" value="Yes" checked="checked"></td>
             <td class="cent"><input type="radio" name="group9" value="No"></td>
         </label>
     </tr>

     <tr>
         <label id="group10">
             <td>Tx Stability</td>
	         <td class="cent"><input type="text" value="43" align="center" name="qty" id="qty10" maxlength="6" size="4" readonly="readonly"/></td>
	         <td class="cent"><input type="radio" name="group10" value="Yes" checked="checked"></td>
             <td class="cent"><input type="radio" name="group10" value="No"></td>
          </label>
    </tr>

    <tr>
         <label id="group11">
             <td>Microphonic Test</td>
	         <td class="cent"><input type="text" value="60" align="center" name="qty" id="qty11" maxlength="6" size="4" readonly="readonly"/></td>
	         <td class="cent"><input type="radio" name="group11" value="Yes" checked="checked"></td>
             <td class="cent"><input type="radio" name="group11" value="No"></td>
         </label>
     </tr>
</table>
<br><br>

<!---Number of units--->
<br><br>
<table class="resultsTbl">

  <tr>
    <th colspan="2">
      <h4>Enter The Number of Units : <input type="text" id="unitNum"></h4>
    </th>
  </tr>

  <tr>
    <td>Total</td>
    <td class="left"><input type="text" name="total" id="total" align="center" /> Seconds</td>
  </tr>

  <tr>
    <td>Standard Hour</td>
    <td class="left"><input type="text" name="stdHour" id="stdHour" align="center" /> Hour</td>
  </tr>

  <tr>
    <td>Earn Hour</td>
    <td class="left"><input type="text" name="earnHour" id="earnHour" /> Hour</td>
  </tr>

</table>

<br><br>
<!--Scenario 1-->
<table class="resultsTbl">

  <tr>
    <th colspan="2" class="scenario1"><input type="checkbox" value="select" align="center" id="check1"> Scenario 1</th>
  </tr>

  <tr>
    <td colspan="2" class="cent">Calculate The Number of Head Count When Days Are Fixed</td>
  </tr>

  <tr>
    <td>Number of Days</td>
    <td class="left"><input type="text" id="numDays" /></td>
  </tr>

  <tr>
    <td>Head Count</td>
    <td class="left"><input type="text" name="hc" id="hc" /> Per Shift</td>
  </tr>

</table>
<br><br>
<!--End of Form For Scenario 1-->
<table class="resultsTbl">

  <tr>
    <th colspan="2" class="scenario2"><input type="checkbox" value="select" align="center" id="check2"> Scenario 2</th>
  </tr>

  <tr>
    <td colspan="2" class="cent">Calculate The Number of Days When Head Counts Are Fixed</td>
  </tr>

  <tr>
    <td>Number of Head Count</td>
    <td class="left"><input type="text" id="numHeadC" /></td>
  </tr>

  <tr>
    <td>Number of Days</td>
    <td class="left"><input type="text" name="days" id="days" /> Days</td>
  </tr>

  <tr>
    <td>Output Per Day</td>
    <td class="left"><input type="text" name="perday" id="perday" /> Per Day</td>
  </tr>

</table>
<br><br>

<table class="resultsTbl">

  <tr>
    <th colspan="2" class="scenario3"><input type="checkbox" value="select"> Scenario 3</th>
  </tr>

  <tr>
    <td colspan="2" class="cent">Calculate The Number of Head Counts According to The Daily Output</td>
  </tr>

  <tr>
    <td>Daily Output</td>
    <td class="left"><input type="text" id="output" /></td>
  </tr>

  <tr>
    <td>HC 2</td>
    <td class="left"><input type="text" name="hcperday" id="hcperday" /> Per Shift</td>
  </tr>

</table>
<br><br><br>
<form align="center">
  <div id="button"><button type="button" name="button1" onClick="Calc()" class="button button1">Calculate</button></div>
</form>
＆＃13;
＆＃13;
＆＃13;

2 个答案:

答案 0 :(得分：0)

您可以为您的值指定默认值。即

var earnDays = ((document.getElementById('unitNum').value / ((document.getElementById('numHeadC').value / stdHour) * 6.6)) / 3) || 0.0;

答案 1 :(得分：0)

结果NaN来自除以零在这一行[只是做了缩进以便轻松发现] 

var earnDays = ((
                  document.getElementById('unitNum').value / 
                   ((document.getElementById('numHeadC').value / stdHour) *6.6) 
                 )
           / 3 );

在chrome devtools中，您可以通过设置断点然后通过鼠标选择表达式来查找值 enter image description here

因此，当document.getElementById（'numHeadC'）。value为''（emty string）时，你必须编写逻辑来查找earnDays，转换为0。

像这样你想成为0.0：

var earnDays = 0.0;
if (document.getElementById('numHeadC').value)
    earnDays = ((document.getElementById('unitNum').value / ((document.getElementById('numHeadC').value / stdHour) * 6.6)) / 3);
相关问题
最新问题