Question

我正在建立一个网站，我想根据提供的信息进行计算。我显然需要在三个字段中的两个字段中提供信息来计算第三个值。

这三个字段是：

Price Gallon
Gallons Bought
总销售

我显然知道我可以通过将Total Sale金额除以Price Per Gallon来计算购买的汽油量。

但是我想根据输入的两个字段来计算。我正试图找出最佳方法。

我非常了解：

检查哪些字段为空
确定要进行的计算类型

这是我到目前为止所做的：

<form>
    <input type="number" id="totalSale" placeholder="Total Sale Amount" class="calculate" />
    <input type="number" id="gallonPrice" placeholder="Price Per Gallon" class="calculate" />
    <input type="number" id="gallons" placeholder="Gallons" class="calculate" />
</form>


<script>
var e = document.getElementsByClassName("calculate");

function calc(){
   var sale_amt = document.getElementById("totalSale");
   var ppg = document.getElementById("gallonPrice");
   var gallons = document.getElementById("gallons");
   if (sale_amt || ppg !== null) {
       var calc_gallons = sale_amt.value / ppg.value;
       gallons.value = calc_gallons.toFixed(3);
   }
}

for (var i = 0; i < e.length; i++) {
    e[i].addEventListener('keyup', calc, false);
}
</script>

Answer 1

逻辑应该考虑当前正在输入哪个元素（在calc中将是this）。此外，您需要考虑当所有三个都有值时会发生什么，并且您更改一个...应该更改其他两个中的哪一个？

看看这是否适合你

var sale_amt = document.getElementById("totalSale");
var ppg = document.getElementById("gallonPrice");
var gallons = document.getElementById("gallons");

function calc(){
    var els = [sale_amt, ppg, gallons];
    var values = [sale_amt.value, ppg.value, gallons.value];
    var disabledElement = els.find(e=>e.disabled);
    var numValues = els.filter(e => e.value !== '' && !e.disabled).length;
    var calc_gallons = function() {
        gallons.value = (values[0] / values[1]).toFixed(3);
    };
    var calc_ppg = function() {
        ppg.value = (values[0] / values[2]).toFixed(3);
    };
    var calc_sale = function() {
        sale_amt.value = (values[1] * values[2]).toFixed(2);
    };
    if (numValues < 3) {
        if (numValues == 1 && disabledElement) {
            disabledElement.disabled = false;
            disabledElement.value = '';
            disabledElement = null;
        }
        els.forEach(e => e.disabled = e == disabledElement || (numValues == 2 && e.value === ''));
    }
    disabledElement = els.find(e=>e.disabled);

    switch((disabledElement && disabledElement.id) || '') {
    case 'totalSale': 
        calc_sale();
        break;
    case 'gallonPrice': 
        calc_ppg();
        break;
    case 'gallons':
        calc_gallons();
        break;
    }
}

var e = document.getElementsByClassName("calculate");
for (var i = 0; i < e.length; i++) {
    e[i].addEventListener('keyup', calc, false);
    e[i].addEventListener('change', calc, false);
}

根据提供的信息进行计算

1 个答案: