Javascript 如何在一个html页面上使用js进行2次乘法

我想用js在同一个html页面上进行两次乘法。就像有一个乘法器一样，我想再做一个。这是我的密码

var a = document.getElementById("a");
var b = document.getElementById("b");
var c = document.getElementById("c");
var xstored = a.getAttribute("data-in");
var ystored = b.getAttribute("data-in");

setInterval(function(){
    if( a == document.activeElement ){
        var temp = a.value;
        if( xstored != temp ){
            xstored = temp;
            a.setAttribute("data-in",temp);
            calculate();
        }
    }
    if( b == document.activeElement ){
        var temp = b.value;
        if( ystored != temp ){
            ystored = temp;
            b.setAttribute("data-in",temp);
            calculate();
        }
    }
},50);

function calculate(){
    c.innerHTML = a.value * b.value;
}

a.onblur = calculate;
calculate();

这是我的代码

我想把这段代码改成2段，但我会替换

 a --> d
 b --> e
 c --> f

但它不起作用

救命啊

---

谢谢

您可以让

计算（）

接受三个参数，这样它就可以使用任意三个元素进行计算

function calculate(input1, input2, output) {
    output.innerHTML = input1.value * input2.value;
}

calculate(a, b, c);
calculate(d, e, f);

编辑：更完整的图片。使用

getElementById

和

getAttribute

就像设置所有变量一样。我做了一些假设，你想重复你用

a

和

b

为

d

和

e

所做的一切。您应该真正使用具有更多语义的变量名

// Get all your elements stores
var a, b, c, d, e, f;
var astored, bstored, dstored, estored;

function calculate(input1, input2, output) {
    output.innerHTML = input1.value * input2.value;
}

setInterval(function(){
    var temp;

    if (a == document.activeElement) {
        temp = a.value;
        if (astored != temp){
            astored = temp;
            a.setAttribute("data-in",temp);
            calculate(a, b, c);
        }
    } else if (b == document.activeElement) {
        temp = b.value;
        if (bstored != temp) {
            bstored = temp;
            b.setAttribute("data-in",temp);
            calculate(a, b, c);
        }
    } else if (d == document.activeElement) {
        temp = d.value;
        if (dstored != temp) {
            dstored = temp;
            d.setAttribute("data-in",temp);
            calculate(d, e, f);
        }
    } else if (e == document.activeElement) {
        temp = e.value;
        if (estored != temp) {
            estored = temp;
            e.setAttribute("data-in",temp);
            calculate(d, e, f);
        }
    }
}, 50);

a.onblur = calculate(a, b, c);
b.onblur = calculate(a, b, c);
d.onblur = calculate(d, e, f);
e.onblur = calculate(d, e, f);
calculate(a, b, c);
calculate(d, e, f);

---

这是我和h，i，j的新代码。谢谢

// Get all your elements stores
var a = document.getElementById("a");
var b = document.getElementById("b");
var c = document.getElementById("c");
var d = document.getElementById("d");
var e = document.getElementById("e");
var f = document.getElementById("f");
var h = document.getElementById("h");
var i = document.getElementById("i");
var j = document.getElementById("j");
var astored = a.getAttribute("data-in");
var bstored = b.getAttribute("data-in");
var dstored = d.getAttribute("data-in");
var estored = e.getAttribute("data-in");
var hstored = h.getAttribute("data-in");
var istored = i.getAttribute("data-in");

function calculate(input1, input2, output) {
    output.innerHTML = input1.value * input2.value;
}

setInterval(function(){
    var temp;

    if (a == document.activeElement) {
        temp = a.value;
        if (astored != temp){
            astored = temp;
            a.setAttribute("data-in",temp);
            calculate(a, b, c);
        }
    } else if (b == document.activeElement) {
        temp = b.value;
        if (bstored != temp) {
            bstored = temp;
            b.setAttribute("data-in",temp);
            calculate(a, b, c);
        }
    } else if (d == document.activeElement) {
        temp = d.value;
        if (dstored != temp) {
            dstored = temp;
            d.setAttribute("data-in",temp);
            calculate(d, e, f);
        }
    } else if (e == document.activeElement) {
        temp = e.value;
        if (estored != temp) {
            estored = temp;
            e.setAttribute("data-in",temp);
            calculate(d, e, f);
        }
    } else if (h == document.activeElement) {
        temp = h.value;
        if (hstored != temp) {
            hstored = temp;
            h.setAttribute("data-in",temp);
            calculate(h, i, j);
        }
    } else if (i == document.activeElement) {
        temp = i.value;
        if (istored != temp) {
            istored = temp;
            i.setAttribute("data-in",temp);
            calculate(h, i, j);
        }
    }
}, 50);

a.onblur = calculate(a, b, c);
b.onblur = calculate(a, b, c);
d.onblur = calculate(d, e, f);
e.onblur = calculate(d, e, f);
h.onblur = calculate(h, i, j);
i.onblur = calculate(h, i, j);
calculate(a, b, c);
calculate(d, e, f);
calculate(h, i, j);

---

您已经了解了函数，如何将当前代码放在一个包含3个参数的函数中，这3个参数是3个元素（

a

、

b

和

c

）？我应该将此代码放在哪里？就像我保留了旧的，我把它添加到代码的末尾？？谢谢你的回复，顺便说一句，我是一个初学者，所以我需要帮助！你能不能编辑我的代码并把它贴在这里，这样我就可以复制粘贴它，我会告诉你它是否有效！我想知道我为什么要问你，去看看我的网站：我做js代码已经好几年了，我想在几个月内做同样的事情。你可以用这个替换你当前的

calculate

函数。您为

a

、

b

和

c

编写的代码需要为

d

、

e

、

f

重复。您需要获取这些元素，然后可以将它们传递到新函数中，如我所示。您是否使用三个参数调用该函数？如果您刚刚替换了该函数，则该函数期望这三个元素进行计算。你不能仅仅通过

calculate（）调用它

您需要提供三个参数，如so

caclulate（a、b、c）

。看看我最近的更新。我会复制你的代码，我会告诉你会发生什么！