价值条件未按预期工作

Question

我有多个输入，我想设置每个输入部分的最小值。例如，我设置了100 的最小输入值。因此，如果所有输入中任何输入的值都小于100，则会显示错误。否则，如果所有输入的值大于或等于100，则会显示成功消息。

在我的情况下，如果我在输入中输入小于值，则会显示错误，但如果我在其他输入中输入更大的值，则会显示成功消息。

    <div class="color-quantity not-selected-inputs selected-input-wrap">
        <input type="text" class="custom_small" name="custom_small" onkeydown="return myFunction(event);">
    </div>
    <div class="color-quantity not-selected-inputs selected-input-wrap">
         <input type="text" class="custom_medium" name="custom_medium" onkeydown="return myFunction(event);">
    </div>
    <input type="text" class="custom_large" name="custom_large" onkeydown="return myFunction(event);">
</div>

      jQuery('.selected-input-wrap > input').map(function () {
      var total = 0;               
      jQuery('input', this).each(function () {

      total += this.value * 1;
     });

    if (parseInt(total) <= 99) {
        jQuery(".select-quantity").html('<p>Please select at least 100 for each color</p>');
    } else if (parseInt(total) >= 100) {
        jQuery(".select-quantity").html('<p>Success</p>'); 
    }

请查看代码并帮助我找出问题

Answer 1

有几个问题。

• 您应该在循环外声明total，否则在每次迭代时将其重置为0。
• 您还应该使用单个each() 调用来循环一组元素，因为map() 旨在用于从这些元素创建一个数组。
• 将值添加到total时，只需调用一次parseInt()
• 您的else if 条件是多余的，可以仅替换为else，甚至可以替换为如下所示的三元。

试试这个：

jQuery(function($) {
    var total = 0;    
    $('.selected-input-wrap > input').each(function () {          
        total += parseInt(this.value, 10);
    });

    var msg = total >= 100 ? '<p>Success</p>' : '<p>Please select at least 100 for each color</p>';
    $(".select-quantity").html(msg); 
});

Answer 2

total 变量循环遍历所有输入，并且根据您的代码仅返回一次。尝试在 if-else 条件后关闭 each 循环并检查一次。

 jQuery('.selected-input-wrap > input').map(function () {
    var total = 0;               
    jQuery('input', this).each(function () {
      total += this.value * 1;
      if (parseInt(total) <= 99) {
          jQuery(".select-quantity").html('<p>Please select at least 100 for each color</p>');
      } else if (parseInt(total) >= 100) {
          jQuery(".select-quantity").html('<p>Success</p>'); 
      }
    });
 })

Answer 3

您可以使用以下 jquery 代码：-

jQuery('.selected-input-wrap > input').map(function () {
      var total = 0;               
      jQuery('input').each(function () {

         total = $(this).val();

         if (parseInt(total) <= 99) {
            jQuery(".select-quantity").html('<p>Please select at least 100 for each color</p>');
         }
         else if (parseInt(total) >= 100) {
            jQuery(".select-quantity").html('<p>Success</p>'); 
         }
     });
});

也许对你有帮助。

Answer 4

试试这个。

var MIN = 100, value = 0;               

jQuery('.selected-input-wrap > input').each(function (idx,el) {
    value += parseInt(el.value);
});

if (value < MIN) {
        jQuery(".select-quantity").html('<p>Please select at least 100 for each color</p>');
} else {
    jQuery(".select-quantity").html('<p>Success</p>'); 
}

Answer 5

在我的情况下，我已经解决了如下问题：

       var total = 0;
       var array_total = new Array();
       jQuery('.selected-input-wrap > input').each(function(index, value) {
        jQuery( ".right-minimu").remove();
        var total = jQuery(this).val();
        console.log("Total Value  : " + total);
        if (total != '') {

            var t_array = array_total.push(total);
        }
        console.log('Total Array : ' + array_total);

    });

    /******** make array unique *************/

                var unique_total = [];
    jQuery.each(array_total, function(i, el) {
        if (jQuery.inArray(el, unique_total) === -1)
            unique_total.push(el);
    });
        var current_urls = jQuery(location).attr('href');
        var rest = current_urls.substr(37, 9); //
        var current_urls = jQuery(location).attr('href');
        var rest_2 = current_urls.substr(37, 18);
        var rest_3 = current_urls.substr(37, 15);
        var rest_4 = current_urls.substr(37, 8);

    jQuery.each(unique_total, function(key, total) {

        for (var i = 0; i <= unique_total.length; i++) {
         if(rest == "bracelets") {  
            if (parseInt(unique_total[i]) <= 99) {
                jQuery(".select-quantity").css("display", "block");
                jQuery(".select-quantity").html('<p>Please select at least 100 for each color</p>');
                jQuery( "#order-overview-table table" ).css("display" , "none") ;
                jQuery( "#order-overview-table").append("<p class='right-minimu'>Please select at least 100 for each color</p>") ;
                jQuery('.btn-cart').removeAttr("onclick");

                return false;

            } else if (parseInt(unique_total[i]) >= 100) {

                jQuery(".select-quantity").css("display", "none");
                jQuery('.btn-cart').attr('onClick', 'productAddToCartForm.submit(this);');
                jQuery(".select-quantity").html('<p>Products Added</p>').delay(4000);

            }
            }