jquery - 如果结果为 NaN 或 0，则使用 jQuery 使结果为 0

Question

使用此代码，用户可能会在“数字”表单字段中输入 0 或什么也不输入。是否有一个“catch all”，以便如果用户执行此操作，NaN 或结果 0.0000% 会被 0 替换？我认为这需要两个逻辑(？)，一个用于 NaN 替换，一个用于更改 .appendTo 结果，以便它只显示 0 而不是 0.00000%

这是一个 JSFiddle - http://jsfiddle.net/sturobson/xTEKm/39/

这是 jquery -

$(document).ready(function() {

$(function(){
$("#result").submit(function(e) {
    e.preventDefault();

    var ele = $("#element").val(),
        target = $("#target").val(),
        context = $("#context").val(),
        border = $("#border").val(),
        margin = $("#margin").val(),
        padding = $("#padding").val();

    console.log(ele, target, context, border, margin, padding);

    var DoubleMargin = parseInt(margin, 10) * 2;
    var DoublePadding = parseInt(padding, 10) * 2;
    var DoubleBorder = parseInt(border, 10) * 2;


    var ActualTarget = parseInt(target, 10) - parseInt(DoubleBorder, 10) - parseInt(DoubleMargin, 10) - parseInt(DoublePadding, 10) * 1;
    var result3 = parseInt(target, 10) - parseInt(DoubleMargin, 10) * 1;
    var MarginResult = ((parseInt(margin, 10) / parseInt(target, 10)) * 100).toFixed(5);
    var PaddingResult = ((parseInt(padding, 10) / parseInt(target, 10)) * 100).toFixed(5);
    var OriginalResult = ((parseInt(ActualTarget, 10) / parseInt(context, 10)) * 100).toFixed(5);


    var BorderResult = parseInt(target, 10) - parseInt(border, 10) * 1;


    //$(".result").append(ele + " " + result + "%");
    $("<p></p>", {
        html: ele + " {<br><span>width: " + OriginalResult + "%;" + " /* " + ActualTarget + " (originally " + target + ") / " + context + " */ " + "<br>border: " + border + "px; " + "<br>margin: " + MarginResult + "%; " + "<br>padding: " + PaddingResult+ "%;" + "<br> </span>}"
    }).hide().appendTo("#code-results").fadeIn();
});

}); 

});

有什么想法吗？

Answer 1

NaN 是“falsey”，因此只要您有一个包含数字的变量，并且您想用 0 替换 NaN >，您可以使用||:

foo = foo || 0;

这是因为JavaScript's curiously-powerful || operator 。因此，只需将其应用于您希望以这种方式处理的代码中的任何值即可。您通常可以在最后执行此操作，因为任何涉及 NaN 的数值计算都会产生 NaN，因此它可以通过计算很好地传播。

就显示 0 而不是 0.00000% 而言，您是对的，您只需要添加一些逻辑即可做到这一点。我不太确定你想在代码中的哪个位置执行此操作，但逻辑并不复杂，例如使用 if:

if (variable === 0) {
    // Just show 0
}
else {
    // Show the full thing
}

...或内联三元运算符:

"text " + (variable === 0 ? "0" : (variable + "%")) + " more text"