使用運行總計時，Javascript $ NaN

Question

我有這個Javascript函數，可以計算多達30個不同的字段，因為用戶可以添加最多30個他們銷售的商品並輸入金額並顯示價格。 此代碼適用於每個訂單項，我最多可以添加30個項目並查看其各自的總計。 在表格的底部我有一個小計區域，這是我無法動搖這個$ NaN出現的地方...當查看代碼時，我得到了NaN的小計，stantot和showtot變量......

$(document).ready(function() {
    var subtotal = 0;
    var stantot = 0;
    var showtot = 0;
    $("input").keyup(function() {
        for (i = 0; i <= 30; i++) {
            var unitp = $("#unitp" + i).val();
            var casep = $("#casep" + i).val();
            var units = $("#units" + i).val();
            var cases = $("#cases" + i).val();
            var st_disc = $("#st_disc").val();
            var sh_disc = $("#sh_disc").val();

            var unitr = (unitp * units);
            var caser = (casep * cases);
            var result = (unitr + caser);
            var st_disc_fix = (st_disc / 100);
            var sh_disc_fix = (sh_disc / 100);
            var st_disc_solo = (st_disc_fix * result);
            var sh_disc_solo = (sh_disc_fix * result);
            var disc_total = (st_disc_fix + sh_disc_fix);
            var disc_whole = (disc_total * result);

            var disc = (result - disc_whole);
            var st_disc_tot = (result - disc_whole);
            var sh_disc_tot = (result - disc_whole);

            $("#line" + i).val('$' + result.toFixed(2));
            $("#disc" + i).val('$' + disc.toFixed(2));
            subtotal += parseInt(result);
            stantot += parseInt(st_disc_tot);
            showtot += parseInt(sh_disc_tot);
        }
        $("#totretail").val('$' + subtotal.toFixed(2));
        $("#standiscount").val('$' + stantot.toFixed(2));
        $("#showdiscount").val('$' + showtot.toFixed(2));

        var totship = ($("#totship").val() * 1);
        var tottax = ($("#tottax").val() * 1);

        var finaltotal = (subtotal + stantot + showtot + totship + tottax);
        $("#total").val('$' + finaltotal.toFixed(2));

    });
});

Answer 1

這就是我要做的。

首先，我將創建一個帶字符串的函數，並保證返回一個數字：

function toNumber(val) {
    var num = parseFloat(val);
    num = isNaN(num) ? 0 : num;
    return num;
}

在這種情況下，任何NaN值都將轉換為零。 您可以更改此選項以滿足您的應用程序的需要。

然后，我會更新你的變量聲明，你可以在這里輸入字段值，如下所示：

var unitp = toNumber($("#unitp" + i).val());
var casep = toNumber($("#casep" + i).val());
var units = toNumber($("#units" + i).val());
var cases = toNumber($("#cases" + i).val());
var st_disc = toNumber($("#st_disc").val());
var sh_disc = toNumber($("#sh_disc").val());

由於所有的出發計算都是基於這些變量，如果你保證， 這些都不是NaN ，那么沒有下列值將是NaN是（除非特殊情況）。

Answer 2

Saint Gerbil的答案非常精彩，這是我未來參考的工作代碼......

$(document).ready(function() {
var subtotal = 0;
var stantot = 0;
var showtot = 0;
$("input").keyup(function() {
    for (var i = 0; i <= 30; i++) {
        var unitp = parseFloat($("#unitp" + i).val()) || 0;
        var casep = parseFloat($("#casep" + i).val()) || 0;
        var units = parseFloat($("#units" + i).val()) || 0;
        var cases = parseFloat($("#cases" + i).val()) || 0;
        var st_disc = parseFloat($("#st_disc").val()) || 0;
        var sh_disc = parseFloat($("#sh_disc").val()) || 0;

        var unitr = (unitp * units);
        var caser = (casep * cases);
        var result = (unitr + caser);
        var st_disc_fix = (st_disc / 100);
        var sh_disc_fix = (sh_disc / 100);
        var st_disc_solo = (st_disc_fix * result);
        var sh_disc_solo = (sh_disc_fix * result);
        var disc_total = (st_disc_fix + sh_disc_fix);
        var disc_whole = (disc_total * result);

        var disc = (result - disc_whole);
        var st_disc_tot = (result - disc_whole);
        var sh_disc_tot = (result - disc_whole);

        $("#line" + i).val(result.toFixed(2));
        $("#disc" + i).val(disc.toFixed(2));
        subtotal += parseFloat((unitp * units) + (casep * cases));
        stantot += parseFloat(st_disc_tot);
        showtot += parseFloat(sh_disc_tot);
    }
    $("#totretail").val(subtotal.toFixed(2));
    $("#standiscount").val(stantot.toFixed(2));
    $("#showdiscount").val(showtot.toFixed(2));

    var totship = ($("#totship").val() * 1);
    var tottax = ($("#tottax").val() * 1);

    var finaltotal = (subtotal + stantot + showtot + totship + tottax);
    $("#total").val(finaltotal.toFixed(2));

    });
}); 

Answer 3

更改

for (i = 0; i <= 30; i++) {

至

for (var i = 0; i <= 30; i++) {

Answer 4

你應該檢查空字符串和空字符串，所以更改所有這樣的語句

var unitp = $("#unitp" + i).val();

至

var unitp = $("#unitp" + i).val()===''?0:$("#unitp" + i).val();

要么

var unitp = $("#unitp" + i).val()||0;

Answer 5

將所有用戶輸入傳遞給parseFloat或parseInt（取決於您是否需要小數點）

$(document).ready(function() {
    var subtotal = 0;
    var stantot = 0;
    var showtot = 0;
    $("input").keyup(function() {
        for (var i = 0; i <= 30; i++) {
            var unitp = parseFloat($("#unitp" + i).val()) || 0;
            var casep = parseFloat($("#casep" + i).val()) || 0;
            var units = parseInt($("#units" + i).val(),10) || 0;
            var cases = parseInt($("#cases" + i).val(),10) || 0;
            var st_disc = parseFloat($("#st_disc").val()) || 0;
            var sh_disc = parseFloat($("#sh_disc").val()) || 0;

            var unitr = (unitp * units);
            var caser = (casep * cases);
            var result = (unitr + caser);
            var st_disc_fix = (st_disc / 100);
            var sh_disc_fix = (sh_disc / 100);
            var st_disc_solo = (st_disc_fix * result);
            var sh_disc_solo = (sh_disc_fix * result);
            var disc_total = (st_disc_fix + sh_disc_fix);
            var disc_whole = (disc_total * result);

            var disc = (result - disc_whole);
            var st_disc_tot = (result - disc_whole);
            var sh_disc_tot = (result - disc_whole);

            $("#line" + i).val('$' + result.toFixed(2));
            $("#disc" + i).val('$' + disc.toFixed(2));
            subtotal += parseInt(result);
            stantot += parseInt(st_disc_tot);
            showtot += parseInt(sh_disc_tot);
        }
        $("#totretail").val('$' + subtotal.toFixed(2));
        $("#standiscount").val('$' + stantot.toFixed(2));
        $("#showdiscount").val('$' + showtot.toFixed(2));

        var totship = ($("#totship").val() * 1);
        var tottax = ($("#tottax").val() * 1);

        var finaltotal = (subtotal + stantot + showtot + totship + tottax);
        $("#total").val('$' + finaltotal.toFixed(2));

    });
});

這將默認NaN條目為0並且應該按預期繼續。

不確定你期望什么值的int或浮點數，所以根據需要交換。

編輯：添加了幾個parseInt，所以你知道如何調用它們。