если значение поля ввода равно 0

0

Я пытаюсь написать, если входное value = 0 скрыть div.class else показать 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();
      }
     });
});

но не повезло

  • 1
    Только при загрузке страницы или когда это входное значение изменяется?
  • 0
    Это работает только один раз. Вы намеревались запускать его каждый раз при изменении ввода?
Показать ещё 8 комментариев
Теги:

3 ответа

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, так как оно быстрее.

Вот jsFiddle, чтобы показать работу сравнения строк, и вот jsFiddle, чтобы показать, что parseInt сравнивает работу.

Отредактировано еще раз: пожалуйста, объясните в деталях, в чем проблема, с которой вы столкнулись, кроме "все еще не работает". Я обновил свои ответы, чтобы показать, как звонить BOTH на загрузку страницы и с помощью keyup.

Или... сумасшедшая мысль... вы просто установите ее в CSS:

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

Тогда вам не нужно делать все это в Javascript. В любом случае это сработает.

Вот jsFiddle для строки, вот jsFiddle для parseInt, и вот jsFiddle для CSS.

  • 0
    когда я изменяю значение на 1, .name-number-field-container не появляется
  • 0
    @anmaree отредактировано, чтобы включить слушателя события.
Показать ещё 7 комментариев
0

Старайтесь не использовать == при выполнении логических сравнений, лучше использовать ===. Вы устраняете необходимость в parseInt таким образом. Поскольку вы сравниваете значение поля ввода, тип данных поля будет string.

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

    $field[($input.val() === "0" ? 'hide' : 'show')]();
});
0
$(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, вы можете сделать

$(document).ready(function() {
    if ($("input.product-quantity").val() === '0') {
        $(".name-number-field-container").hide();
    }
    else {
        $(".name-number-field-container").show();
    }
});
  • 0
    Вы должны использовать === вместо == . Вы можете найти, что это должно быть === "0" после этого, и вам не нужен parseInt
  • 1
    Никогда не используйте parseInt без второго параметра. Это может привести к очень странным результатам :).
Показать ещё 8 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню