Javascript jquery切换取决于textbox的值

这一定很简单，但我只是被这个困住了。。。我有一个产品列表，其中有一个数量输入字段，旁边有一列价格。价格显示了两个值。其中一个是隐藏的。如果输入字段的值超过某个值，则应隐藏其他价格。 例子： （输入：[]，显示价格1价格2）

我错过了什么？表格名称可能是什么？ 这只是第一部分

---

我的另一个问题是。。如何使所有输入字段（以class1为类）的总和大于5，则执行相同的操作。（因此，现在取决于输入字段的总和，而不是每个单独的字段）

如果要在页面加载时调用此函数，则需要在每次更改输入字段的值时运行它

考虑将if块包装为以下格式：

$('input.class1').blur(function() {
  if($('input.class1').val() > 5) {
     $('.one').show();
     $('.two').hide();
  }
});

或类似的效果，考虑使用<代码> $.On（）/<代码> < /P> 如果要求和，请为每个输入分配一个公共类，并使用

$。each（）

：

希望这有帮助

var inputs = $('input[class^=class]');  // get inputs which class name 
                                        // start with "class" eg: class1, class2..

// fire blur event
// you may use keyup or something else

inputs.on('blur', function(e) {
    var val = 0;

    // adding all inputs value
    // of all inputs with class = blured input class

    $('input.' + this.className).each(function() {
      val += parseInt( this.value, 10);        
    });

    // checking for condition
    if (val > 5) {
       $(this).next('.one').show().next('.two').hide();
    } else {
       $(this).next('.one').hide().next('.two').show();
    }
});

if (val > 5) {
   $('.one').show();
   $('.two').hide();
} else {
   $('.one').hide();
   $('.two').show();
}

if (val > 5) {
   $('.one').show();
   $('.two').hide();
} else {
   $('.one').hide();
   $('.two').show();
}

注 将所有jQuery代码放在

$（document.ready（）

中

据评论

if (val > 5) {
   $('.one').show();
   $('.two').hide();
} else {
   $('.one').hide();
   $('.two').show();
}

代码

if (val > 5) {
   $('.one').show();
   $('.two').hide();
} else {
   $('.one').hide();
   $('.two').show();
}

换衣服

val += parseInt( this.value, 10);         

到

据评论 如何为选择框实现上述代码

---

您可能最适合向要跟踪的所有输入元素添加公共类，然后使用

$（'.common class'）.blur（function（）{…}）感谢您的示例。。然而，我有一些问题的关键之一。如果我把一个放在第一个，一个放在第二个，他们的表现很好。然后说第一个4，第二个4，它将更新第二个，而不是第一个。只有当我让两个人都说1，然后把它改成2，第一个才会改变。。很奇怪。除此之外，如果总和超过5，我希望它同时更新价格（prod1和prod2的价格）…就是这样做的。。杰出的非常感谢。然而。。。我仍然有问题。如果我在第一个框中填写的内容超过5个，那么在我填写下一个框之前，它不会做任何事情。。有办法解决这个问题吗？（因此，它将添加除空字段以外的所有内容）现在，如何使用选择框而不是文本框？@Malachi在选择框的情况下，您需要使用
change
event。
val += parseInt( this.value, 10);         

val += parseInt( this.value || 0, 10); // default 0, if no value given    

var selects = $('select[class^=class]');  // get selects which class name
                            // start with "class" eg: class1, class2..

// fire change event

selects.on('change', function(e) {
    var val = 0;

    // adding all selects value

    $('select.' + this.className).each(function() {
      val += parseInt( this.value, 10);        
    });

    // checking for condition
    if (val > 5) {
       $(this).next('.one').show().next('.two').hide();
    } else {
       $(this).next('.one').hide().next('.two').show();
    }
});