jQuery不将parseInt空白输入解析为0

Question

Javascript看起来像这样：

<script type="text/javascript">
$(document).ready(function(){
    var totalOwed = <?php echo $totalTally; ?>;

    $("#cash").keyup(function() { doThis(); });
    $("#card").keyup(function() { doThis(); });

    var paidSoFar = 0;


    function doThis() {
        paidSoFar = parseInt($("#cash").val()) + parseInt($("#card").val());
        alert(paidSoFar);
        if (paidSoFar >= totalOwed) { 
            endCalc = paidSoFar - totalOwed;
            $("#endCalc").html("Change: " + endCalc); 
        }
        else { 
            remaining = totalOwed - paidSoFar;
            $("#endCalc").html("Remaining: " + endCalc);
        }
    }
});
</script>

HTML如下：

Total Owed: <?php echo $totalTally; ?><br />
Cash: <input type="text" id="cash" /><br />
Card: <input type="text" id="card" /><br />
<div id="endCalc"></div>

但是，在尝试读取文本输入的值时，paidSoFar变量以NaN结尾。

---

UDATE

现在，我的Javascript看起来像这样：

<script type="text/javascript">
$(document).ready(function(){
    var totalOwed = <?php echo $totalTally; ?>;

    $("#cash").keyup(function() { doThis(); });
    $("#card").keyup(function() { doThis(); });

    var paidSoFar = 0;


    function doThis() {
        paidSoFar = parseInt($("#cash").val(), 10) + parseInt($("#card").val(), 10);
        alert(paidSoFar);
        if (paidSoFar >= totalOwed) { 
            endCalc = paidSoFar - totalOwed;
            $("#endCalc").html("Change: " + endCalc); 
        }
        else { 
            remaining = totalOwed - paidSoFar;
            $("#endCalc").html("Remaining: " + endCalc);
        }
    }
});
</script>

HTML如下：

Total Owed: <?php echo $totalTally; ?><br />
Cash: <input type="text" id="cash" /><br />
Card: <input type="text" id="card" /><br />
<div id="endCalc"></div>

但paidSoFar变量在尝试读取文本输入的值时最终为NaN。

Answer 1

更新后

您可以使用一元运算符。例如，

+$("#cash").val()

如同，

paidSoFar = (+$("#cash").val()) + (+$("#card").val());

---

BEFORE UPDATE

专门回答您的问题而不详细讨论所有其他问题。在以下代码行中。

function remaining() {
  ...
  if (paidSoFar >= totalOwed) {
    ...
  } else {
    remaining = totalOwed - paidSoFar;
    ...
  }
}

如果您按照remaining的使用情况进行操作，则可以清楚地看到您正在覆盖remaining个号码。因此，下次尝试使用remaining()时，您的JavaScript控制台可能会出现以下错误。

Uncaught TypeError: number is not a function

以下用法也令人担忧。

function remaining() {
    ...
    $("#changeOrRemaining").html(remaining);
    ...
}

这个显然是一个无限循环。

检查How to open the JavaScript console in different browsers?以获取有关访问浏览器控制台的详细信息。

Answer 2

在浏览器中检查您的控制台日志（Firebug最好）。您最有可能遇到警报以下的错误，它会在收到错误后停止所有JavaScript的运行。