0

大家好,我正在尝试使用 javascript 进行非常简单的计算以找到运行总数。我似乎错过了什么。我确实查看了 SO 并发现了一些非常相似的场景,但是,我似乎与我自己的代码无关。

这是我用来计算运行总数的脚本。

    var total = 0;

    function GetTotal(txtBox) {
        total += parseInt(txtBox.value) || 0;
        $("#chkTotal").html(total);
    }

这是我认为的一些代码:

 <div class="editor-field">
        @Html.TextBox("FirstDemo", String.Empty, new { id = "firstdemo", onchange =     "GetTotal(this)" })
        @Html.ValidationMessageFor(model => model.FirstDemo)
    </div>


<div>
        <h3>Total Checked</h3>
    </div>
    <div id="chkTotal"></div>

总计计算完美,直到文本框中的值发生更改,在这种情况下,文本框中输入的任何内容都会再次添加到运行总计中。

谁能帮我?

4

2 回答 2

4

问题是total变量的全局范围:我想您在表单中有几个文本字段,您可以在其中设置它们以以onchage相同的方式处理事件。第一次输入某些内容时,该值会正确添加到总计中,但是当您在任何文本字段中更改某些内容时,它会再次添加新值。同样,因为total具有全局范围。

您应该真正total在函数内部移动并重新解析您感兴趣的输入元素中的所有值。

由于您使用的是 jquery,因此您可以执行以下操作:

function GetTotal(txtBox) {
    var total = 0;
    $('input:text').each(function(index, value) {
        total += parseInt($(value).val() || 0);
    });

    $("#chkTotal").html(total);
}​

这是一个jsfiddle为您演示它。

于 2012-11-16T21:07:47.340 回答
1

最简单的解决方案,遍历所有表单元素并重做计算。

我在您的代码中看到了 jQuery,因此它是一个获取元素和每个循环的基本选择器。

function GetTotal(txtBox) {
    var total = 0;
    $(".calculationClass").each(
        function() {
            total += parseInt(this.value,10) || 0;
        }
    );
    $("#chkTotal").html(total);
}
于 2012-11-16T21:01:31.463 回答