javascript - JS增加/减少多个输入数字变量

Question

我一直在尝试增加和减少“val”类的值，我将在一页中多次使用它们。我还需要为它们设置 MIN 和 MAX 值。

   <input type="button" value="-" class="decreaseVal">
   <input type="number" min ="1" max="22" value="20" class="val" disabled>
   <input type="button" value="+" class="increaseVal">


   // JS CODE THAT I TRY
   $(".decreaseVal").click(function() {
      var num = $(this).next('input').val();
   });


   $(".increaseVal").click(function() {
      var num = $(this).prev('input').val();
   });

我可以获取它们的值，但无法更改它们。大家有什么建议吗？

Answer 1

试试这个

$(".decreaseVal").click(function() {
  var input_el=$(this).next('input');
  var v= input_el.val()-1;
  if(v>=input_el.attr('min'))
  input_el.val(v)
});


$(".increaseVal").click(function() {
  var input_el=$(this).prev('input');
  var v= input_el.val()*1+1;
  if(v<=input_el.attr('max'))
  input_el.val(v)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="-" class="decreaseVal">
<input type="number" min="1" max="22" value="20" class="val" disabled>
<input type="button" value="+" class="increaseVal">