新しい値を入力.innerHTML

Question

私はから新しい値を取得する方法を理解する上で問題があります。span id = 'savings'。ご覧のとおり、私は銀行口座の仕事をする必要があります。預金がすべていいですが、私が預金したものから出発するのではなく、私が出発点0から始めると、私はいくらかのお金を引き出したいときです。

var inputAmount = document.getElementById('inputAmount'); 
 
var withdBtn = document.getElementById('withdBtn'); 
 
var savingSpan = document.querySelector('#savings'); 
 
var myBalance = Number(savingSpan.innerHTML); 
 
var depBtn = document.getElementById('depBtn'); 
 

 
depBtn.addEventListener('click', function() { 
 
    var savAmount = Number(inputAmount.value); 
 
    var depositBalance = savAmount + myBalance; 
 
    savingSpan.innerHTML = depositBalance; 
 
}); 
 

 
withdBtn.addEventListener('click', function() { 
 
    var savAmount = Number(inputAmount.value); 
 
    var withdrawBalance = (myBalance.innerHTML) - savAmount; 
 
    savingSpan.innerHTML = withdrawBalance; 
 

 
});

<h1></h1> 
 

 
<div class="savings" id="accounts"> 
 

 
    <h2>Savings Account</h2> 
 

 
    <h3> Your current balance is </h3> 
 
    <span>$</span> <span id="savings"> 00.00 </span> 
 

 
    <p> 
 
    <input id="inputAmount" type="number" placeholder="Enter amount here"> 
 
    </p> 
 

 
    <p> 
 
    <button id="withdBtn" type="button">Withdraw</button> 
 
    <button id="depBtn" type="button">Deposit</button> 
 
    </p> 
 

 
</div>

Answer 1

あなたはwithBtn機能にsavingSpanでmyBalanceを切り替える必要があります。 myBalanceは数であるため、attribut innerHTML

withdBtn.addEventListener('click', function() { 
    var savAmount = Number(inputAmount.value); 
    var withdrawBalance = (savingSpan.innerHTML) - savAmount; 
    savingSpan.innerHTML = withdrawBalance; 
}); 

EDIT持っていません：複数の預金の
を、あなたもdepBtn機能にNumber(savingSpan.innerHTML)でmyBalanceを交換する必要があります。 myBalanceは最初に1回だけセットを取得するため、現在の残高を表しません。

depBtn.addEventListener('click', function() { 
    var savAmount = Number(inputAmount.value); 
    var depositBalance = savAmount + Number(savingSpan.innerHTML); 
    savingSpan.innerHTML = depositBalance; 
}); 

Answer 2

は、あなたのコード内の2つのミスがあります：あなたがmyBalance.innerHTMLを呼んでいる

1. が、この変数はすでに値を保持しているとそれだけでmyBalanceでなければなりません。
2. ボタンをクリックしたときにmyBalance変数を更新する必要があります。現在

単純な解決策：単にdepositBalanceとwithdrawBalanceをmyBalanceに置き換えます。

depBtn.addEventListener('click', function() { 
    var savAmount = Number(inputAmount.value); 
    myBalance = savAmount + myBalance; 
    savingSpan.innerHTML = myBalance; 
}); 


withdBtn.addEventListener('click', function(){ 
    var savAmount = Number(inputAmount.value); 
    myBalance = myBalance - savAmount; 

    savingSpan.innerHTML = myBalance; 
}); 

https://jsfiddle.net/enpo/wdu87Lek/も参照してください。