jQuery：超過額を加算する

Question

私が1ボタンを押すと、私は銀色か金色かを問うでしょう。私は銀をクリックすると

、私のボーナスは、今の私はexpetationで働いている150 000

によって追加私のボーナス意志ます： インクリメント450K、300K、150Kによるとそう

のが、今、 出力は0150000150000150000

ここに私のコードは

var currentCircleId = ''; 
 
var balance='0' 
 
$(document).ready(function(){ 
 
     $(".circle").click(function(){ 
 
     $(".selection").toggle(); 
 
     currentCircleId = $(this).attr('id'); 
 
    }); 
 
    $('.selection').click(function(){ 
 
     $(".selection").toggle(); 
 
     var newClass = $(this).data('new-class'); 
 
     $('#' + currentCircleId).removeClass('gold silver').addClass(newClass); 
 
    }); 
 

 
    $('.countsilver').click(function(){ 
 
     balance+=150000; 
 
     $("#bonus1").html(balance); 
 
    }); 
 
});

.circle{ 
 
\t border-radius: 50%; 
 
\t border: solid 1px black; 
 
\t height: 33px;width: 33px; 
 
\t background: none; 
 
\t position: relative; 
 
\t cursor: pointer; 
 
} 
 
.silver{ 
 
\t background-color:#c0c0c0; 
 
} 
 
.gold{ 
 
\t background-color:#ffd700; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<a class="selection countsilver" data-new-class="silver" style="display: none;">SILVER</a> 
 
\t <a class="selection countgold" data-new-class="gold" style="display: none;">GOLD</a> 
 
\t <div class="circle" id="16"><p id="z16"></p></div> 
 

 
\t <p>Bonus 1 gain = <span id="bonus1"></span>

です

誰かが正しい方法を教えてくれますか？ ありがとうございました

Answer 1

理由は、balance変数を文字列オブジェクトとして宣言しているためです。

var balance = '0'; 

したがって、毎回1​​50000を連結します。 あなたは今、あなたのバランスのオブジェクトは、今ではそうで0 + 150000を追加します、整数として機能する

var balance = 0; 

としてバランスを宣言しなければなりません。

Answer 2

var currentCircleId = ''; 
 
var balance=0; 
 
$(document).ready(function(){ 
 
     $(".circle").click(function(){ 
 
     $(".selection").toggle(); 
 
     currentCircleId = $(this).attr('id'); 
 
    }); 
 
    $('.selection').click(function(){ 
 
     $(".selection").toggle(); 
 
     var newClass = $(this).data('new-class'); 
 
     $('#' + currentCircleId).removeClass('gold silver').addClass(newClass); 
 
    }); 
 

 
    $('.countsilver').click(function(){ 
 
     balance+=150000; 
 
     $("#bonus1").html(balance); 
 
    }); 
 
});

.circle{ 
 
\t border-radius: 50%; 
 
\t border: solid 1px black; 
 
\t height: 33px;width: 33px; 
 
\t background: none; 
 
\t position: relative; 
 
\t cursor: pointer; 
 
} 
 
.silver{ 
 
\t background-color:#c0c0c0; 
 
} 
 
.gold{ 
 
\t background-color:#ffd700; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<a class="selection countsilver" data-new-class="silver" style="display: none;">SILVER</a> 
 
\t <a class="selection countgold" data-new-class="gold" style="display: none;">GOLD</a> 
 
\t <div class="circle" id="16"><p id="z16"></p></div> 
 

 
\t <p>Bonus 1 gain = <span id="bonus1"></span>