无法正确显示号码答案

【问题标题】：Can't display number correctly无法正确显示号码
【发布时间】：2016-09-20 23:35:45
【问题描述】：

我正在开发一个资金管理程序。有一个输入框，您必须在其中输入您的收入。每当我输入我的号码并单击 Enter 时，该号码会出现在侧面，但是当我添加另一个号码时，它不会正确加起来。

HTML

<!DOCTYPE html>
<html>
<head>
    <!-- Edit title -->
    <title>Banking App</title>
    <!-- Stylesheet -->
    <link rel="stylesheet" type="text/css" href="assets/css/style.css">
</head>
<body>
<div class="main">

    <header>
        <h1>Bank Account Manager</h1>
    </header>

    <div class="displayInfo">
        <div class="displayBalance">
            <h2 class="displayBalanceTag">Balance: <span class="displayBalanceNumber"></span></h2>
        </div>
    </div>
    <div class="inputInfo">
        <center>
            <input type="text" name="earned" placeholder="How Much Have You Earned?" class="earned">
            <input type="text" name="spent" placeholder="How Much Have You Spent?" class="spent">
        </center>
    </div>

</div>

<!-- JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<!-- Main.js -->
<script type="text/javascript" src="assets/js/main.js"></script>
</body>
</html>

// VARIABLES
var balance; //stores users balance
var earnings; //stores users earnings

var earned = $(".earned"); //input users earnings
var spent = $(".spent"); //input users spendings
var displayBalanceNumber = $(".displayBalanceNumber"); //displays users balance

// START
$("document").ready(function () {
    balance = 0;

    init();
})

// INIT
function init() {
    reset(); //resets everything
    $(earned).bind("keypress", addEarnings);
}

function addEarnings(e) {
    //check for keycode 13 ( enter key )
    if(e.which === 13) {
        earnings = $(this).val(); //get value from input
        balance = balance + earnings;
        displayBalanceNumber.html(balance);
        displayBalanceNumber.html(balance);
    }
}

// RESET
function reset() {
    displayBalanceNumber.html(balance); //make value inside balance holder to 0
}

【问题讨论】：

哪里不对？你输入什么数字，你得到什么结果？
^ 你还期望得到什么？
应该是earnings = +$(this).val();
实际上，我想我可以猜到您的问题earnings = $(this).val();，然后是balance = balance + earnings; - 在这种情况下，earnings 将是一个字符串，因此您不会进行加法，而是进行字符串连接。例如，1 + "2" //12。取而代之的是 Number($(this).val())

标签： javascript jquery numbers

【解决方案1】：

您的线路 balance = balance + earnings; 将 earnings 视为字符串。当您将字符串添加到数字时，它会将其全部转换为字符串。您需要做的是将earnings 转换为整数。将该行替换为balance = balance + +earnings;。 + 将 earnings 转换为数字。

【讨论】：