Question

从输入字段获取值有一些问题。
某些输入字段是计算过程的结果，例如＃t1_potensi和＃t2_potensi。虽然#aliran是整个计算过程的结果。

这是我的HTML代码。

<input oninput="hitung()" name="v_potensi" id="v_potensi" type="text" placeholder="liter . . ." />        
<input oninput="hitung()" name="a_potensi" id="a_potensi" type="text" placeholder="menit . . ." />
<input oninput="hitung()" name="b_potensi" id="b_potensi" type="text" placeholder="menit . . ." />

<input oninput="hitungT1()" name="kecepatan_air" id="kecepatan_air" type="text" placeholder="km/jam . . ." />
<input oninput="hitungT1()" name="jarak1" id="jarak1" type="text" placeholder="kilometer . . ." />

<input oninput="hitungT2()" name="kecepatan_back" id="kecepatan_back" type="text" placeholder="km/jam . . ." />
<input oninput="hitungT2()" name="jarak2" id="jarak2" type="text" placeholder="kilometer . . ." />

<!-- #t1_potensi = 0.65 + ((60 / #kecepatan_air) * #jarak1) -->
<input readonly="readonly" oninput="hitung()" name="t1_potensi" id="t1_potensi" type="text" placeholder="menit . . ." />

<!-- #t2_potensi = 0.65 + ((60 / #kecepatan_back) * #jarak2) -->
<input readonly="readonly" oninput="hitung()" name="t2_potensi" id="t2_potensi" type="text" placeholder="menit . . ." />

<!-- #aliran = (#v_potensi / (#a_potensi + #b_potensi + #t1_potensi + #t2_potensi)) - 0.1 -->
<input readonly="readonly" name="aliran" id="aliran" type="text" placeholder="liter/menit . . ." />

我使用javascript进行计算过程，得到＃t1_potensi和＃t2_potensi的结果。我的问题开始时我尝试计算整体（#aliran），我的javascript函数特别是获得整体结果无法正常工作。这是我的＃t1_potensi，＃t2_potensi和#aliran的javascript。

//To get #t1_potensi    
function hitungT1() {
                var kecKm = document.getElementById('kecepatan_air').value;
                var d1 = document.getElementById('jarak1').value;
                var result = document.getElementById('t1_potensi');
                //convert Km/jam to mph 
                var kecMph = Math.round(kecKm * 0.621371192);
                //convert liter to miles
                var d1Miles = d1 * 0.621371192;
                var x = 60 / kecMph;
                var kali = x.toFixed(1) * d1Miles.toFixed(2);
                var hasil = 0.65 + kali;
                result.value = hasil.toFixed(2);
            }
//To get #t2_potensi
function hitungT2() {
                var kecKm = document.getElementById('kecepatan_back').value;
                var d2 = document.getElementById('jarak2').value;
                var result = document.getElementById('t2_potensi');
                //convert Km/jam to mph
                var kecMph = Math.round(kecKm * 0.621371192);
                //convert liter to miles
                var d1Miles = d2 * 0.621371192;
                var x = 60 / kecMph;
                var kali = x.toFixed(1) * d1Miles.toFixed(2);
                var hasil = 0.65 + kali;
                result.value = hasil.toFixed(2);
            }

//To get #aliran
function hitung() {
                var vol = document.getElementById('v_potensi').value;
                var a = document.getElementById('a_potensi').value;
                var b = document.getElementById('b_potensi').value;
                var t1 = document.getElementById('t1_potensi').value;
                var t2 = document.getElementById('t2_potensi').value;
                var hasil = document.getElementById('aliran');
                //convert liter to galon
                var galon = Math.round(vol * 0.264172051);
                var sumT = t1 + t2;
                var sum = a + sumT + b;
                var dev = galon / sum;
                var result = Math.round(dev - 0.1);
                hasil.value = result;
            }

有没有人能帮我解决问题？或者让我的javascript函数更有效率。感谢。

Answer 1

对您使用document.getElementById（＆＃39; ...＆＃39;）获得的数字使用parseFloat()。值：

//To get #t1_potensi    
function hitungT1() {
            var kecKm = parseFloat(document.getElementById('kecepatan_air').value);
            var d1 = parseFloat(document.getElementById('jarak1').value);
            var result = document.getElementById('t1_potensi');
            //convert Km/jam to mph 
            var kecMph = Math.round(kecKm * 0.621371192);
            //convert liter to miles
            var d1Miles = d1 * 0.621371192;
            var x = 60 / kecMph;
            var kali = x.toFixed(1) * d1Miles.toFixed(2);
            var hasil = 0.65 + kali;
            result.value = hasil.toFixed(2);
        }
//To get #t2_potensi
function hitungT2() {
            var kecKm = parseFloat(document.getElementById('kecepatan_back').value);
            var d2 = parseFloat(document.getElementById('jarak2').value);
            var result = document.getElementById('t2_potensi');
            //convert Km/jam to mph
            var kecMph = Math.round(kecKm * 0.621371192);
            //convert liter to miles
            var d1Miles = d2 * 0.621371192;
            var x = 60 / kecMph;
            var kali = x.toFixed(1) * d1Miles.toFixed(2);
            var hasil = 0.65 + kali;
            result.value = hasil.toFixed(2);
        }

//To get #aliran
function hitung() {
            var vol = parseFloat(document.getElementById('v_potensi').value);
            var a = parseFloat(document.getElementById('a_potensi').value);
            var b = parseFloat(document.getElementById('b_potensi').value);
            var t1 = parseFloat(document.getElementById('t1_potensi').value);
            var t2 = parseFloat(document.getElementById('t2_potensi').value);
            var hasil = document.getElementById('aliran');
            //convert liter to galon
            var galon = Math.round(vol * 0.264172051);
            var sumT = t1 + t2;
            var sum = a + sumT + b;
            var dev = galon / sum;
            var result = Math.round(dev - 0.1);
            hasil.value = result;
        }

另外，对我来说，为什么只有在编辑前三个文本框之一后调用hitung()函数才有点棘手。为什么不在每次更改任何字段时都调用所有三个函数？那不是更好吗？

由你决定。此外，在您按上述方式拨打parseFloat电话后，请使用console.log(string or variable to log)，例如console.log('dev is: ' + dev)。这样您就可以轻松地调试代码 - 在任何计算过程中查看所有值。

另外，你真的需要围绕最终结果吗？

如何使用javascript从输入字段获取值

1 个答案: