gpt4 book ai didi

javascript - 不使用按钮计算平均值

转载 作者:行者123 更新时间:2023-12-02 21:24:36 24 4
gpt4 key购买 nike

如何在html中计算平均值而不单击按钮显示结果,每次输入类型文本更改时,输出也会更改而无需单击按钮

function multiplyBy() {
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num1 * num2;
}

function divideBy() {
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num1 / num2;
}
<form>
1st Number : <input type="text" id="firstNumber" /><br> 2nd Number: <input type="text" id="secondNumber" /><br>
<input type="button" onClick="multiplyBy()" Value="Multiply" />
<input type="button" onClick="divideBy()" Value="Divide" />
</form>
<p>The Result is : <br>
<span id="result"></span>
</p>

最佳答案

为两个按钮添加一个input监听器:

const inputs = document.querySelectorAll('input');
for (const input of inputs) {
input.addEventListener('input', () => {
document.getElementById("result").textContent = (Number(inputs[0].value) + Number(inputs[1].value)) / 2;
});
}
1st Number : <input type="text" id="firstNumber" /><br> 2nd Number: <input type="text" id="secondNumber" /><br>
<p>The Result is : <br>
<span id="result"></span>
</p>

关于javascript - 不使用按钮计算平均值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60768165/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com