簡體   English   中英

如何為兩個行使用單個函數來計算值?

[英]How can I use a single function for both Rows to calculate value?

當我在第4個輸入上輸入一些數字時。 它會自動計算最后兩個輸入中的值。 對於這些單獨的行,我使用了兩個單獨的函數。 如何使用適用於兩者的單個功能?

 function myFunction() { var b = document.getElementById('b').value; var d = document.getElementById('d').value; var e = document.getElementById("e").value; var f = document.getElementById('f').value = (d*e).toFixed(3); var g = document.getElementById('g').value = (f*b).toFixed(3); } function myFunction1() { var b = document.getElementById('b1').value; var d = document.getElementById('d1').value; var e = document.getElementById("e1").value; var f = document.getElementById('f1').value = (d*e).toFixed(3); var g = document.getElementById('g1').value = (f*b).toFixed(3); } 
 <table border="1" style="border-collapse:collapse;"> <tr> <td>Produto</td> <td style="display: none;"></td> <td>Diluição</td> <td>Necessario de produto para limpar 1m2</td> <td>Metragem do ambiente a ser limpo</td> <td>Resultado em litros de produto concentrado para limpar a metragem do cliente</td> <td colspan="2">Quantidade de solução em litros</td> </tr> <tr> <td colspan="7" style="text-align: center;">CONCENTRADOS- LINHA CONC</td> </tr> <tr> <td rowspan="3">Concentrax Desinfetante</td> <td><input id="b" type="text" name="" value="15" disabled></td> <td><input id="c" type="text" name="" value="1/15" disabled> </td> <td><input id="d" type="text" name="" value="0.011" disabled> </td> <td><input id="e" type="text" name="" value="0" oninput="myFunction()"></td> <td><input id="f" type="text" name="" value="0.00"></td> <td><input id="g" type="text" name="" value="0.00"> </td> </tr> <tr> <td><input id="b1" type="text" name="" value="200" disabled></td> <td><input id="c1" type="text" name="" value="1/200" disabled> </td> <td><input id="d1" type="text" name="" value="0.00083" disabled> </td> <td ><input id="e1" type="text" name="" value="0" oninput="myFunction1()"></td> <td><input id="f1" type="text" name="" value="0.00"></td> <td><input id="g1" type="text" name="" value="0.00"> </td> </tr> </table> 

或者,如果您想要一種可擴展的方法:

function myFunction(suffix) {
  var b = document.getElementById('b' + suffix).value;
  var d = document.getElementById('d' + suffix).value;
  var e = document.getElementById("e" + suffix).value;
  var f = document.getElementById('f' + suffix).value = (d*e).toFixed(3);
  var g = document.getElementById('g' + suffix).value = (f*b).toFixed(3);   
}

然后第一行使用myFunction('')進行調用,第二行使用myFunction('1')進行調用。

function myFunction(id) {
 if(id == "firstRow"){
    var b = document.getElementById('b').value;
    var d = document.getElementById('d').value;
    var e = document.getElementById("e").value;
    var f = document.getElementById('f').value = (d*e).toFixed(3);
    var g = document.getElementById('g').value = (f*b).toFixed(3);   
 }else if(id == "secondRow"){
    var b = document.getElementById('b1').value;
    var d = document.getElementById('d1').value;
    var e = document.getElementById("e1").value;
    var f = document.getElementById('f1').value = (d*e).toFixed(3);
    var g = document.getElementById('g1').value = (f*b).toFixed(3);   
 }
}

HTML

<tr>
    <td rowspan="3">Concentrax Desinfetante</td>
    <td><input id="b" type="text" name="" value="15" disabled></td>
    <td><input id="c" type="text" name="" value="1/15" disabled> </td>
    <td><input id="d" type="text" name="" value="0.011" disabled> </td>
    <td><input id="e" type="text" name="" value="0" oninput="myFunction('firstRow')"></td>
    <td><input id="f" type="text" name="" value="0.00"></td>
    <td><input id="g" type="text" name="" value="0.00"> </td>
</tr>

<tr>
    <td><input id="b1" type="text" name="" value="200" disabled></td>
    <td><input id="c1" type="text" name="" value="1/200" disabled> </td>
    <td><input id="d1" type="text" name="" value="0.00083" disabled> </td>
    <td ><input id="e1" type="text" name="" value="0" oninput="myFunction('secondRow')"></td>
    <td><input id="f1" type="text" name="" value="0.00"></td>
    <td><input id="g1" type="text" name="" value="0.00"> </td>

工作碼筆

https://codepen.io/anon/pen/dKwWvW

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM