Jquery: input value при добавлении 1, результат увеличивается на 2

Не могу разобраться, почему jquery increment++ добавляет к переменной не 1, а 2. Консоль выдает такую картину...

before increment: 1  VM3089 script.js:186 
after increment: 2  VM3089 script.js?ver=5.5.3:183 
before increment: 2   script.js?ver=5.5.3:18
after increment: 3   script.js?ver=5.5.3:186

html

<div class="wrapper">
    <span class="input-number-decrement">–</span>
    <input class="input-count" type="number" value="1" min="1" max="10">
    <span class="input-number-increment">+</span>
</div>

Jquery

$(document).on('click', '.input-number-increment', function () {
    var tgtInp = $(this).closest('.wrapper').find('.input-count');
    console.log('before increment: ' + tgtInp.val());
    var thtInpVal = +tgtInp.val();
    thtInpVal++;
    console.log('after increment: ' + thtInpVal);
    var tgtInpMax = parseInt(tgtInp.attr('max'));
    if (thtInpVal > tgtInpMax) {
        thtInpVal = tgtInpMax;
    }

    tgtInp.attr('value', thtInpVal);
    //prints 3;

})

при этом, если из js кода убрать действие "+", то консоль выдает правильное значение инпута (это 1), то есть:

before increment: 1  VM3089 script.js script.js:186

Need help :)

$(document).on('click', '.input-number-increment', function() {
  var tgtInp = $(this).closest('.wrapper').find('.input-count');
  console.log('before increment: ' + tgtInp.val());
  var thtInpVal = +tgtInp.val();
  thtInpVal++;
  console.log('after increment: ' + thtInpVal);
  var tgtInpMax = parseInt(tgtInp.attr('max'));
  if (thtInpVal > tgtInpMax) {
    thtInpVal = tgtInpMax;
  }

  tgtInp.attr('value', thtInpVal);
  //prints 3;

})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrapper">
  <span class="input-number-decrement">–</span>
  <input class="input-count" type="number" value="1" min="1" max="10">
  <span class="input-number-increment">+</span>
</div>


Ответы (0 шт):