javascript - Javascript：使用不同类型的输入自动计算总和

Question

我有一个 ajax 代码，它的概念是使用 javascript 自动计算输入值的总和。所以我想添加更多字段来满足我的需求。然后我添加了一些具有给定值的输入[复选框]。这个想法是在选中该框时。它的值将被计算到进程中，就像在 input[text] 中输入一样。

这是代码：

<script language="javascript">
function AddInputs()
{
    var total = 0;
    var coll = document.getElementsByTagName("input")
    for ( var i = 0; i<coll.length; i++)
    {
        var ele = coll[i];
        total += parseInt(ele.value);
    }
    var Display = document.getElementById("Display");
    Display.innerHTML = total;
}
</script>

这是表格：

<input onkeyup="AddInputs()" />
<input onkeyup="AddInputs()" />
<input onkeyup="AddInputs()" />
<input type="checkbox" onkeyup="AddInputs()" value="100" />
<span id="Display"></span>

问题是我无法使用这些输入框来计算复选框。请建议。

Answer 1

这是因为onkeyup当您释放键盘上的键时会触发事件，而当您单击复选框时不会发生这种情况。您应该使用其中一个onchange（但这在较旧的 IE 中不起作用）或onclick.

另请注意， 的值100将始终添加到total. 如果您只想在选中复选框时才计算复选框，请使用类似

if (ele.type !== 'checkbox' || ele.checked) {
    total += parseInt(ele.value);
}