Question

我正在尝试写如果输入值= 0隐藏div.class其他显示div.class

这是我尝试的，但只有它似乎正在工作

$(document).ready(function() {
    if ($("input.product-quantity").val() == 0) {
        $(".name-number-field-container").hide();
    }
    else {
        $(".name-number-field-container").show();
    }
});

添加一个on更改我尝试了这个：

$(document).ready(function() {
    $('.product-quantity').change(function() {
    var $cont = $('.name-number-field-container');
      if($(this).val() === '0'){
           $cont.hide();
      } else {
           $cont.show();
      }
     });
});

但没有运气

Answer 1

.val()将返回一个字符串，因此消除隐式转换：

$(function(){
    var $cont = $('.name-number-field-container'),
        $qty = $('.product-quantity');

    function setCont(val){
        if(val === '0'){
            $cont.hide();
        } else {
            $cont.show();
        }
    }

    $qty.on('keyup',function(){    
        setCont(this.value);
    });

    setCont($qty.val());
});

无需parseInt，只需比较字符串即可。如果你真的担心某人输入“00000”或其他东西，那么是的，请使用parseInt：

    $(function(){
    var $cont = $('.name-number-field-container'),
        $qty = $('.product-quantity');

    function setCont(val){
        if(parseInt(val,10) === 0){
            $cont.hide();
        } else {
            $cont.show();
        }
    }

    $qty.on('keyup',function(){    
        setCont(this.value);
    });

    setCont($qty.val());
});

但是那时你正在不必要地转换价值，所以除非绝对需要，否则我会反对这一点。

已修改：显然没有人通知您需要将此绑定到事件。我选择了keyup来立即查看更改，但是当blur不再具有焦点时，您可以轻松使用input。我也将其切换为this.value，因为它更快速。但

Here is a jsFiddle to show the string compare working和here is a jsFiddle to show the parseInt compare working。

再次编辑：请详细说明您遇到的问题是什么，除了“它仍然无效。我已更新我的答案，以显示如何在页面加载时调用BOTH通过keyup。

或者......疯狂的想法......你只需在CSS中设置它：

.name-number-field-container {
    display:none;
}

然后你不需要在Javascript中全部完成。无论哪种方式都可行。

Here is the jsFiddle for the string，here is the jsFiddle for the parseInt和here is the jsFiddle for the CSS。

Answer 2

$(document).ready(function() {
    if (parseInt($("input.product-quantity").val(), 10) === 0) {
        $(".name-number-field-container").hide();
    }
    else {
        $(".name-number-field-container").show();
    }
});

应该有效。您的代码不起作用，因为val()返回字符串，parseInt()返回字符串的整数部分。

如果您想通过字符串进行检查，则可以执行

$(document).ready(function() {
    if ($("input.product-quantity").val() === '0') {
        $(".name-number-field-container").hide();
    }
    else {
        $(".name-number-field-container").show();
    }
});

Answer 3

在进行逻辑比较时尽量不要使用==，最好使用===。你不需要那样parseInt。因为您要比较输入字段的值，所以字段的数据类型将为string。

$(document).ready(function() {
    var $input = $("input.product-quantity");
    var $field = $(".name-number-field-container");

    $field[($input.val() === "0" ? 'hide' : 'show')]();
});

如果输入字段编号值等于0

3 个答案: