gpt4 book ai didi

javascript - JavaScript 总和

转载 作者:行者123 更新时间:2023-11-28 00:56:25 26 4
gpt4 key购买 nike

我试图获取三个分数中每一个的值并将它们相加并显示在“总计:”中。我的问题是,我不知道如何做到这一点,以便每次其中一个分数值发生变化时,相应的总分值也会随之变化。

我可以在某处调用“onchange”来完成这项工作吗?谢谢。

<!DOCTYPE html>
<html>
<head>
<script src="getTotal.js" type="text/javascript"></script>
</head>
<body>
<header>
<tbody>
<tr>
<td>
Total:
<output id="total" class="totalScore"></output>
</td>
</tr>
</tbody>
</header>
<table>
<tbody>
<td>Score 1</td>
<td><input type="number" id="score1"/></td>

<td>Score 2</td>
<td><input type="number" id="score2" /></td>

<td>Score 3</td>
<td><input type="number" id="score3" /></td>
</tbody>
</table>

<script type="text/javascript">assign();</script>

</body>
</html>

这是我的 JavaScript 类 getTotal.js

function total() {
var score1 = document.getElementById("score1");
var score2 = document.getElementById("score2");
var score3 = document.getElementById("score3");

return score1 + score2 + score3;
}

function assign() {
var totalScore = document.getElementById("total");
totalScore = total;
}

最佳答案

您的代码“按原样”将无法工作。正如我在评论中提到的,您需要查看 parseFloat() (或 parseInt() 取决于您允许的值),以及 DOM 对象的 value 属性。最后,onchangeonkeyup事件可用于用户交互。

将所有这些结合起来将为您提供以下工作示例:

var score1Field = document.getElementById('score1'),
score2Field = document.getElementById('score2'),
score3Field = document.getElementById('score3');

function sumit()
{
var score1 = parseFloat( score1Field.value ),
score2 = parseFloat( score2Field.value ),
score3 = parseFloat( score3Field.value );

if( isNaN( score1 ) ) { score1 = 0; }
if( isNaN( score2 ) ) { score2 = 0; }
if( isNaN( score3 ) ) { score3 = 0; }

total = score1 + score2 + score3;

document.getElementById('total').innerHTML = total;
}

// Bind our events:
score1Field.onkeyup = sumit;
score2Field.onkeyup = sumit;
score3Field.onkeyup = sumit;

// Call it when the page loads to handle default values:
sumit();

jsFiddle Demo

关于javascript - JavaScript 总和,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26170830/

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