如果輸入字段號值等於0

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();
    }
});

添加一個變化，我嘗試了這個：

$(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可以立即看到更改，但是當input不再具有焦點時，也可以輕松地使用blur 。 我也將其切換為this.value ，因為它速度更快。

這是一個jsFiddle來顯示字符串比較工作 ， 這是一個jsFiddle來顯示parseInt比較工作 。

再次編輯 ：請詳細說明您面臨的問題，而不是“仍然無法解決。我已經更新了答案，以顯示如何在頁面加載和鍵盤輸入時同時調用。

或者...瘋狂的想法...您只需在CSS中進行設置：

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

然后，您無需使用Javascript完成所有操作。 無論哪種方式都可以。

這是字符串的jsFiddle ， 這是parseInt 的jsFiddle，這是CSS的jsFiddle 。

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()返回String，而parseInt()返回String的整數部分。

如果要按String檢查，可以執行

$(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')]();
});