javascript - 防止输入量在 JQuery 中变为负数

Question

我当前的网站上有一个功能，当您单击加号按钮或减号按钮时，该功能会增加和减少一个值。由于它作为订单数量出现在电子商务网站上，因此选择负值没有多大意义。我试图向我的 jquery 添加一些逻辑，以防止该值变为负值，但我的嵌套逻辑由于某种原因无法正常工作。任何帮助将不胜感激!

JQuery

$(document).ready(function(e) {

$('.up').on('click',function(){
            var num = $(this).parent().find('.input-quantity').val();
            $(this).parent().find('.input-quantity').val(parseInt(num)+1);
        });
        $('.down').on('click',function(){
              var num = $(this).parent().find('.input-quantity').val();
            $(this).parent().find('.input-quantity').val(parseInt(num) -1);
        }); 

});

HTML

 <div class="quantity clearfix">
    <span>quantity:</span>  
           <div  class="incre">
        <em class="down">-</em ><input type="text"  value="1" class="input1 input-quantity "><em class="up">+</em ><br>

</div>  
      <div class="clear"></div>  

   </div>

CSS

.quantity                        {margin: 30px 0 0 0;max-width:242px;border: solid 1px #d3d2d2;padding: 3px 0 6px 11px;border-radius: 4px;}
.quantity  span                 {display:inline-block;float:left;font-family:Arial, Helvetica, sans-serif;font-size: 14px;line-height: 20px;padding: 6px 0 0 0;color: #333333;}
.incre                  {display:inline-block;float:right;margin: 0;width: 39%;}
.incre  em                  {display: inline-block;font-size: 26px;line-height: 31px;width: 29px;height: 29px;background: #cccccc;border-radius: 100%;color: #fff;padding: 0;float: left;text-align: center;margin: 0; cursor:pointer;}
.incre  .input1             {outline:none;border:0;display: inline-block;float: left;width: 20px;text-align: center;margin: 0 7px 0 3px;padding: 3px 0 0 0;font-size: 19px;height: 28px;line-height: 19px;color: #000;}
.quantity  small                {display:block;font-size: 18px;line-height: 20px;color: #000;padding: 0 12px 0 9px;}

我尝试过的:

我已经尝试更改我的 jQuery 中“向下”按钮的功能，以表示如果在执行该函数时该值等于零，则使该值等于 1 并递减该值。这种黑客攻击将防止值(value)永远变为负值。

    $('.down').on('click',function(){
          var num = $(this).parent().find('.input-quantity').val();
     if(num = 0){num = 1}
        $(this).parent().find('.input-quantity').val(parseInt(num) -1);
    }); 

我也试过:

if(num === "0"){num === "1"}

在递减值的语句之前，因为看起来整数可能已作为字符串返回。

无论如何，我们将不胜感激!

Answer 1

使用输入type=number，然后设置最小值

<input type="number" min="0">