javascript - 计算只读输入的动态值总和。 Jquery 和 AJAX

Question

所以我的表单已经基本完成，我需要在 AJAX 根据用户选择填充输入字段后计算输入字段的总值。我已经尝试了很多次，试图找到解决方案，但没有任何效果......呃。

以下是需要计算的输入字段以及需要返回总和的字段的 html:

<input type="text" class="form-control prices" id="lt1total" placeholder="Amount" value="" readonly>
<input type="text" class="form-control prices" id="lt2total" placeholder="Amount" value="" readonly>
<input type="text" class="form-control prices" id="lt3total" placeholder="Amount" value="" readonly>

<input type="text" class="form-control disabled" id="lttotal" placeholder="Amount" value="" readonly>

这是 AJAX 请求(每个请求都有一个，它们都可以正常工作):

$.ajax({
        method: 'GET',
        url: 'example.url',
        data: {
            lt1datetype: lt1datetype,
            lt1tt: lt1tt,
        }
    }).done(function(result) {
        console.log('', result);
        $('#lt1total').val(result);
    });

这是我唯一可以为 #lttotal 赋值的 jquery 函数:

$(document).ready(function() {
    var sum = 0;
    $(".prices").each(function(){
        sum += Number($(this).val());
    });
    $("#lttotal").val(sum);
});

它只输出 0 的金额。 AJAX 得到的值就像这样 123.00 或 1234.00 我被卡住了并且很恼火。任何帮助或指导将不胜感激。

Answer 1

使用$.when在所有请求完成后运行计算代码。

var request1 = $.ajax({
        method: 'GET',
        url: 'example.url',
        data: {...}
    }).done(function(result) {
        console.log('', result);
        $('#lt1total').val(result);
    });

var request2 = $.ajax({
        method: 'GET',
        url: 'example.url',
        data: {...}
        }
    }).done(function(result) {
        console.log('', result);
        $('#lt2total').val(result);
    });

$.when(request1, request2....., requestn).done(function(){
    // set totals here instead of on page load
})