Javascript 在jquery中运行总计时出现问题

Javascript 在jquery中运行总计时出现问题,javascript,jquery,Javascript,Jquery,我在计算准确的运行总数时遇到了一个问题。当您在输入字段中输入数字时,我会得到该行项目的准确总数,但总总数会显示为更高的数字。请注意,这是一个动态表单,id将根据我添加到表单中的表单字段的数量而变化。此外,我将其设置为对每个输入字段进行计算onKeyUp,而不是计算按钮 计算单个项目的代码如下所示: function calcLineItem(id) { var id = $(id).attr("id"); var Item1 = $("#Item1" + id).val();

我在计算准确的运行总数时遇到了一个问题。当您在输入字段中输入数字时,我会得到该行项目的准确总数,但总总数会显示为更高的数字。请注意,这是一个动态表单,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();
}
这将给我这个特定输入字段的总数。最后的函数,
CalCalCalFields()
,应该对表单中的所有项进行计算,以获得所有输入字段的总计:

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">

我希望这会有所帮助。

在计算总计时,您似乎从未删除以前的总计。比如说,

我一开始的总数是0。我换了ID1,一共换了700个。现在我的总数是700。但是,根据您的代码,如果我再次更改ID1并将其设置为680,我的总数将为1380(700+680)


您可能应该从0开始,在calcGrandTotal()上再次循环所有总计,以便在计算新的行项目总计之前提取所有客户端更改或跟踪以前的总计,以便可以从总计中正确扣除。此外,如果你有很多行项加起来等于你的总数,你可以考虑只调用CalcGrand总计(),当你的文本框失去焦点时,否则,你可能会在后台进行大量的JS计算,这将干扰网站的动画效果和整体响应能力。

在计算总计时,你似乎从未删除之前的总计。比如说,

我一开始的总数是0。我换了ID1,一共换了700个。现在我的总数是700。但是,根据您的代码,如果我再次更改ID1并将其设置为680,我的总数将为1380(700+680)

您可能应该从0开始,在calcGrandTotal()上再次循环所有总计,以便在计算新的行项目总计之前提取所有客户端更改或跟踪以前的总计,以便可以从总计中正确扣除。此外,如果你有很多行项加在你的总总数上,你可以考虑只调用CalcGrand总计()当你的文本框失去焦点时,否则你可以在后台进行大量的JS计算,这将干扰你的站点的动画和整体响应性。

这是怎样的?

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());
}
这个怎么样

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());
}

我会稍微改变一下。您将需要一个函数来返回一行的合计值(看起来像calcLineItem差不多,只需删除CalCalCalfFields调用。向需要合计的每一行添加一个类似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);
}

我的做法略有不同。您将需要一个函数来返回一行的合计值(看起来calcLineItem几乎可以做到这一点,只需删除CalCalCalFields调用。在需要合计的每一行中添加一个类似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);
}

我认为您可能没有正确地处理这个问题。您能为您的问题添加一些标记吗?对项目组进行几次迭代会很有帮助。我很确定这不是使用
.map()的正确方法
在jQuery中-虽然我自己从未使用过它,但我不能确定。我想你可能处理问题的方法不正确。你能为你的问题添加一些标记吗?重复几次项目组会很有帮助。我很确定这不是使用
.map()的正确方法
在jQuery中-虽然我自己从未使用过它,但我不能确定。这只会在他的列表中拾取一个更改的项目来计算总计,并给出0+changedItemTotal=changedItemTotal的结果。他将需要一个(i=0;iI最初对此感到厌倦,虽然它一开始似乎起作用,但我意识到,由于我会在表单中添加更多字段,因此每次都会重置我的总计,并给出特定行项目的总计。无论如何,在计算总计时,您应该记住这一点:始终从0开始,循环所有您希望计数的元素。有什么问题吗否则可能会出错和/或使事情过于复杂。这将只拾取列表中的一个更改项来计算总计,并给出0+changedItemTotal=changedItemTotal的结果。他将需要一个(i=0;iI最初对此感到厌倦,虽然它一开始似乎起作用,但我意识到,由于我会在表单中添加更多字段,因此每次都会重置我的总计,并给出特定行项目的总计。无论如何,在计算总计时,您应该记住这一点:始终从0开始,循环所有您希望计数的元素。有什么问题吗否则可能会出错和/或使事情过于复杂