Question

我在尝试为计算得到准确的运行总数时遇到问题。当您在输入字段中输入数字时，我会得到该订单项的准确总计，但总计会出现更高的数字。请注意，这是一个动态表单，id将根据我添加到表单的表单字段的数量而改变。另外，我设置为每个输入字段而不是计算按钮进行计算onKeyUp。

计算单个项目的代码是：

function calcLineItem(id) {
    var id = $(id).attr("id");
    var Item1 = $("#Item1" + id).val();
    var Item2 = $("#Item2" + id).val();
    var Item3 = $("#Item3" + id).val();

    function calcTotal(Item1, Item2, Item3){
        var total;
        total = Math.round((Item1 * Item2) * Item3);
        return total;
    }

    $("#total" + id).text(calcTotal(Item1, Item2, Item3));

    calcAllFields();
}

这将为我提供此特定输入字段的总和。最后的函数calcAllFields()应该对我表单中的所有项进行计算，以便给出所有输入字段的总计：

function calcAllFields(id) {
    var id = $(id).attr("id");
    $('#target1').text($("#total" + id).map(function() {
        var currentValue = parseFloat(document.getElementById("currentTotal").value);
        var newValue = parseFloat($("#total" + id).text());
        var newTotal = currentValue + newValue;
        document.getElementById("currentTotal").value = newTotal;
        return newTotal;
        }).get().join());
}

变量currentTotal从表单上的隐藏字段获取其值：

<input type="hidden" id="currentTotal" value="0">

当我输入数字时，该行的计算将是准确的，但总计将是不准确的，因为currentTotal的值将继续随着我在输入字段中的每个关键笔划而递增。关于如何避免这种情况发生的任何想法？

更新：表单输入字段的示例：

<tr id="row1">
  <td><input type="text" id="field_1 onKeyUp="calcLineItem("#row1")></td>
  <td><input type="text" id="field_2 onKeyUp="calcLineItem("#row1")></td>
</tr>

我希望这会有所帮助。

Answer 1

在计算总计时，您似乎永远不会删除之前的总数。例如，

我从总计0开始。我改变ID1并获得总计700.现在我的总数是700.但是，使用你的代码，如果我再次更改ID1并设置为680，我的总计将是1380（700 + 680）。

您应该从0开始并在calcGrandTotal（）上再次遍历所有总计，以便在计算新订单项总计之前获取所有客户更改或跟踪之前的总计，以便您可以从累计。此外，如果你有很多行项目累加到你的总计，你可能会考虑只在你的文本框失去焦点时调用calcGrandTotal（），否则你可能会在后台进行大量的JS计算干扰您网站的动画和整体响应能力。

Answer 2

这是怎么回事？

function calcAllFields(id) {
    var id = $(id).attr("id");
    document.getElementById("currentTotal").value = 0; //reset the total as it will be caluclated next
    $('#target1').text($("#total" + id).map(function() {
        var currentValue = parseFloat(document.getElementById("currentTotal").value);
        var newValue = parseFloat($("#total" + id).text());
        var newTotal = currentValue + newValue;
        document.getElementById("currentTotal").value = newTotal;
        return newTotal;
        }).get().join());
}

Answer 3

我会稍微改变一下。您将需要一个返回行总数的函数（看起来像calcLineItem几乎就是这样，只需删除calcAlffields调用。将一个类像calcrow一样添加到需要总计的每一行。而不仅仅是做这样的事情

function updateTotal () {
    total = 0;
    $.each($(".calcrow"), function(index, value) {
        total += calcRow($(value).attr("id"));
        });
    $("#currentTotal").value(total);
}

另一个如果你不想再次计算每一行（看起来你在某处存储了一行），行更新函数会更新行总数而不是调用此updateTotal。

function updateTotal () {
    total = 0;
    $.each($(".rowtotal"), function(index, value) {
        total += $(value).attr("id");
        });
    $("#currentTotal").value(total);
}

在jquery中运行总计的问题

3 个答案: