輸入數字值減去第二個輸入數字值將返回NaN

Question

例如，當我將50寫入.res輸入並將25寫入第二個輸入.res2並單擊等於時，它必須為負，但警報返回的不是數字

<div class="wind">
     <input class="res" value=" " maxlength="24">
     <input class="res2" value=" " maxlength="24">
     <button class="equal">=</button>
<div class="numbers">

$(".one,.two,.three,.four,.five,.six,.seven,.eight,.nine,.zero,.dot").on('mousedown',function(event){
    event.preventDefault();
    if($('.res').is(":focus")){
        firstNumber = $('.res').val(Number(($('.res').val()) + $(this).val()));
} else {
    secondNumber = $('.res2').val(Number(($('.res2').val()) + $(this).val()));
    }
})
$('.equal').click(function(){
    alert(firstNumber-secondNumber);
})

Answer 1

firstNumber和secondNumber變量是在.equal點擊處理程序范圍之外的第.equal點擊處理程序中定義的。 當該事件發生時，您需要從DOM中檢索值，如下所示：

 $('.equal').click(function() { var firstNumber = parseInt($('.res').val(), 10); var secondNumber = parseInt($('.res2').val(), 10); console.log(firstNumber - secondNumber); }) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="wind"> <input class="res" value="50" maxlength="24"> <input class="res2" value="25" maxlength="24"> <button class="equal">=</button> <div class="numbers"></div> </div>