Question

我希望将输入的数字设为tbQtyFailed和tbQtyTested，计算％费率，然后在tbFailurePercent中显示％。我以为我可以创建一个JS函数，然后为结果分配tbFailurePercents值，但不能让它工作，我不确定为什么。我附上了代码。谢谢！

<td>Qty Tested:</td>
<td>
    <input type="text" id="tbQtyTested">
</td>
</tr>
<script type="text/javascript">
    function PercentageMath() {
        var qtyTested = document.getElementById("tbQtyTested");
        var qtyFailed = document.getElementById("tbQtyFailed");
        var failurePercent = parseFloat(qtyTested.value) / parseFloat(qtyFailed.value);

        var display = document.getElementById("tbFailurePercent");
        display.value = failurePercent;
    } else {
        document.getElementById("tbFailurePercent").value = "NAN";
    }
    };
</script>
<tr>
    <td>Bag Number of Previous Test Period:</td>
    <td>
        <input type="text" id="tbPreviousPeriod">
    </td>
    <td>Result(s):</td>
    <td>
        <input type="text" id="tbResults" value="" onchange="PercentageMath()">
    </td>
</tr>
<tr>
    <td>Bag Numbers within Failure Scope:</td>
    <td>
        <input type="text" id="tbBagsWithinScope">
    </td>
    <td>Failure % (Failed/Tested):</td>
    <td>
        <input type="text" id="tbFailurePercent" disabled>
    </td>
</tr>

Answer 1

您的代码缺少qty失败的字段，结果字段没有任何意义。我不知道包的字段是什么。

function perc() {
  var qtyT = document.getElementById("qtyT").value;
  var qtyF = document.getElementById("qtyF").value;
  var fRes = document.getElementById("failPerc");
  var pRes = document.getElementById("passPerc");
  var failPerc = parseFloat(qtyF) / parseFloat(qtyT);
  //console.log('fail%: ' + failPerc);
  var passPerc = parseFloat(1 - failPerc);
  //console.log('pass%: ' + passPerc);
  fRes.value = (failPerc * 100) + "%";
  pRes.value = (passPerc * 100) + "%";
};

<table>
  <tbody>

    <tr>
      <td>Qty Tested:</td>
      <td>
        <input type="text" id="qtyT">
      </td>
      <td>Qty Failed:</td>
      <td>
        <input type="text" id="qtyF" oninput="perc();">
      </td>
    </tr>

    <tr>
      <td>Bag#PrevTest:</td>
      <td>
        <input type="text" id="bagPrev">
      </td>
      <td>Passed:</td>
      <td>
        <input type="text" id="passPerc" readonly>
      </td>
    </tr>
    <tr>
      <td>Bag#FailScope:</td>
      <td>
        <input type="text" id="bagFail">
      </td>
      <td>Failed:</td>
      <td>
        <input type="text" id="failPerc" readonly>
      </td>
    </tr>
  </tbody>
</table>

HTML / JS - 文本输入文本框1 + 2后无法更新文本框3？

1 个答案: