时间戳

首页 > 解决方案 > 如何对两个行使用单个函数来计算值？

javascript - 如何对两个行使用单个函数来计算值？

问题描述

当我在第四个输入中输入一些数字时。它会自动计算最后两个输入中的值。我为这些单独的行使用了两个单独的函数。如何使用对两者都适用的单一功能？

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>

标签： javascripthtml

解决方案

或者，如果您想要一种可扩展的方法：

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') 调用它。

推荐阅读