Question

我有输入框，点击+/-图标可以增加产品数量。默认情况下会有＆＃34; 添加＆＃34;按钮，点击它启用+/-输入字段并隐藏＆＃34; 添加＆＃34;按钮。现在，当输入值达到0时，我需要显示＆＃34; 添加＆＃34;按钮并隐藏输入字段。

这是我使用的脚本

$('button').on('click',function(){
        $(".incrmentrs").show();
      $(this).hide();
});
$(function () {

    $('.add').on('click',function(){
        var $qty=$(this).parent().find('.qty');
        var currentVal = parseInt($qty.val());
        if (!isNaN(currentVal)) {
            $qty.val(currentVal + 1);
        }
    });
    $('.minus').on('click',function(){
        var $qty=$(this).parent().find('.qty');
        var currentVal = parseInt($qty.val());
        if (!isNaN(currentVal) && currentVal > 0) {
            $qty.val(currentVal - 1);
        }
    });
});

Demo

Answer 1

试试这个：

https://jsfiddle.net/ovt6f7ev/

更改减负点击事件代码，如下所示：

$('.minus').on('click',function(){
            var $qty=$(this).parent().find('.qty');
            var currentVal = parseInt($qty.val());
            console.log(currentVal)
            if (!isNaN(currentVal) && currentVal > 1) { // check if value is 1 or more then minus value
                $qty.val(currentVal - 1);
            } else { // else show button
               $(".incrmentrs").hide();
               $("button").show(); 
            }
 });

Answer 2

将此事件添加到<input>

$(".qty").change('input', function () {
   if ($(this).val() == 0) {
      $(".incrmentrs").hide();
      $("button").show();
   }
});

使用以下内容在减号按钮click上触发事件：

$qty.trigger("change");

JSFiddle demo

观看<input>上的活动，而不是<button>。在这种情况下，当用户直接写入<input>时，事件也会触发。

输入值达到0

2 个答案: