javascript - 我可以在 Javascript 中动态更新计算输出吗？

Question

我正在使用 JavaScript/HTML 对核 react 堆进行建模，并且正在努力动态更新我感兴趣的结果。

react 堆温度和 react 堆压力都取决于控制棒高度和冷却剂泵流量。有没有办法让结果数字显示在屏幕上，以便它们随着用户更改输入而动态更新？

我可以使用按钮来触发温度/压力的计算，但如果可能的话，我宁愿将其显示在屏幕上!

很高兴使用 jQuery/AJAX 解决方案，但不知道从哪里开始，也不知道它到底是什么，我会要求他们做什么 - 我不想只从另一个页面获取信息，我想工作进行不断变化的计算。

谢谢!

HTML

<div id="Reactor">
<button onClick = "IncCRH()">Increase Control Rod Height</button>
<button onClick = "DecCRH()">Decrease Control Rod Height</button>
<div id="result"></div>
<br>
<button onClick="test()">Control Rod Height</button>
<br>
<br>
<button onClick = "IncCPF()">Increase Coolant Pump Flow</button>
<button onClick = "DecCPF()">Decrease Coolant Pump Flow</button>
<br>
<br>
<button onClick = "test2()"> Coolant Pump Flow</button>
<br>
<br>
<p id = "ReacTemp"></p>
<br>
<br>
<p id = "ReacPres"></p>
    </div>

JavaScript

var ControlRodHeight = 50;
var CoolantPumpFlow = 20;

function IncCRH(){
    user = ++ControlRodHeight;
    if (ControlRodHeight > 100) {
        ControlRodHeight = 100;
}
ReactorTemperature = (445 + (ControlRodHeight*4.5)  -(CoolantPumpFlow*2.3));
ReactorPressure = (10 + (ControlRodHeight*1.36)-(CoolantPumpFlow*0.0065));
}

function DecCRH() {
    user = --ControlRodHeight;
    if (ControlRodHeight < 0) {
        ControlRodHeight = 0
    }
ReactorTemperature = (445 + (ControlRodHeight*4.5)-(CoolantPumpFlow*2.3));
ReactorPressure = (10 + (ControlRodHeight*1.36)-(CoolantPumpFlow*0.0065));
}

function test(){
alert (ControlRodHeight);
}

function IncCPF(){
user = ++CoolantPumpFlow;
if (CoolantPumpFlow > 40) {
    CoolantPumpFlow = 40;
}
ReactorTemperature = (445 + (ControlRodHeight*4.5)-(CoolantPumpFlow*2.3));
ReactorPressure = (10 + (ControlRodHeight*1.36)-(CoolantPumpFlow*0.0065));
}

function DecCPF(){
user = --CoolantPumpFlow;
if (CoolantPumpFlow < 0) {
    CoolantPumpFlow = 0;
}
ReactorTemperature = (445 + (ControlRodHeight*4.5)   -(CoolantPumpFlow*2.3));
ReactorPressure = (10 + (ControlRodHeight*1.36)-(CoolantPumpFlow*0.0065));
}

function test2(){
    alert (CoolantPumpFlow);
 }

var ReacTemp = ReactorTemperature.toFixed(0);

document.getElementById("ReacTemp").innerHTML = "Reactor Temperature is " + ReacTemp

var ReacPres = ReactorPressure.toFixed(0);

document.getElementById("ReacPres").innerHTML = "Reactor Pressure is " + ReacPres

Answer 1

您可以使用onkeyup属性，因此每次按下键时都会调用该函数。如果有人正在输入表单字段中输入内容，那么您可以执行以下操作:

<input type="text" onkeyup="myFunction()">

您也可以在 JavaScript 中进行操作如果您愿意，但没有必要。

var input = document.getElementById('#reactor');
input.onkeyup = function(){call MyFunction()};