Question

我有一段代码使用两个输入按钮来启动更新多个输出的功能，包括下面显示的那些。但是，我希望输出显示数字，因为它们从之前的值循环到更新的数字，并且之前指向了setInterval函数 - 是否可以使这个工作用于多个输出？

我试图将我的tempCounters编号以区分，但这似乎没有用 - 任何帮助都会非常感激！

HTML

<button onClick = "IncTHR()">Increase Throttle</button>
<button onClick = "DecTHR()">Decrease Throttle</button>
<input type="text" id="THR">

<div id="CoolantTemp1"></p>
<div id="CoolantTemp2"></p>

的javascript

var CoolantTemp1 = 366;
var tempCounter1 = 366;
var CoolantTemp2 = 250;
var tempCounter2 = 250;
var Throttle = 5;
var ControlRodHeight = 50;
var PrimaryPump = 1;

function IncTHR(){
Throttle++;
if (Throttle > 10){
    Throttle = 10;
}
CoolantTemp1 = (220+(ControlRodHeight*2.2)+(PrimaryPump*20)+(Throttle*3.2));
update();

var incInt = setInterval(function() {
    if (tempCounter1 < CoolantTemp1){
        displayResults(tempCounter1);
        tempCounter1++;
    } else {
        displayResults(CoolantTemp1);
        tempCounter1 = CoolantTemp1;
        clearInterval(incInt);
    }
}, 500);

CoolantTemp2 = (190+(ControlRodHeight*2.2)+(PrimaryPump*22)-(Throttle*2.9));

var incInt = setInterval(function() {
    if (tempCounter2 < CoolantTemp2){
        displayResults(tempCounter2);
        tempCounter++;
    } else {
        displayResults(CoolantTemp2);
        tempCounter2 = CoolantTemp2;
        clearInterval(incInt);
    }
}, 500);
}

function DecTHR(){
Throttle--;
if (Throttle < 0){
    Throttle = 0;
}
CoolantTemp1 = (220+(ControlRodHeight*2.2)+(PrimaryPump*20)+(Throttle*3.2));
update();

var decInt = setInterval(function() {
    if (tempCounter1 > CoolantTemp1){
        displayResults(tempCounter);
        tempCounter--;
    } else {
        displayResults(CoolantTemp1);
        tempCounter1 = CoolantTemp1;
        clearInterval(decInt);
    }
}, 500);

CoolantTemp2 = (190+(ControlRodHeight*2.2)+(PrimaryPump*22)-(Throttle*2.9));

var decInt = setInterval(function() {
    if (tempCounter2 > CoolantTemp2){
        displayResults(tempCounter2);
        tempCounter--;
    } else {
        displayResults(CoolantTemp2);
        tempCounter2 = CoolantTemp2;
        clearInterval(decInt);
    }
}, 500);
}


function update() {
document.getElementById("THR").value = Throttle;
}

function displayResults(temp) {
document.getElementById("CoolantTemp1").innerHTML = "Coolant Temperature 1 is " + temp1;
document.getElementById("CoolantTemp2").innerHTML = "Coolant Temperature 2 is " + temp2;
}

Answer 1

它会抛出错误temp1 is not defined，html中也没有CoolantTemp2元素。所以你必须替换它：

  document.getElementById("CoolantTemp1").innerHTML = "Coolant Temperature 1 is " + temp1;
  document.getElementById("CoolantTemp2").innerHTML = "Coolant Temperature 2 is " + temp2;

用这个：

  document.getElementById("CoolantTemp1").innerHTML = "Coolant Temperature 1 is " + CoolantTemp1;
  document.getElementById("CoolantTemper2").innerHTML = "Coolant Temperature 2 is " + CoolantTemp2;

此外，每个<div>都应以</div>关闭，如下所示：

<div id="CoolantTemp1"></div>
<div id="CoolantTemper2"></div>#

请参阅演示 - ＆gt; http://codepen.io/8odoros/pen/bWGOzP

多个计数器从同一个函数启动？

1 个答案: