如何分别计算每个部分的总值：Jquery答案

【问题标题】：How to calculate the total value of each section separately: Jquery如何分别计算每个部分的总值：Jquery
【发布时间】：2016-03-24 18:17:49
【问题描述】：

我有 10 多个部分，每个部分包含三个输入，如下所示：

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

    <div class="color-quantity">
        <input onkeydown="return myFunction(event);" name="white_small" class="custom_small" type="text">
        <input onkeydown="return myFunction(event);" name="white_medium" class="custom_medium" type="text">
        <input onkeydown="return myFunction(event);" name="white_large" class="custom_large" type="text">
    </div>
</div>

我正在计算每个部分的产品数量，但它根据每个输入中输入的数量为我提供了全部产品数量。但我想单独列出部分中的产品数量

我正在使用 jQuery 执行此操作，请检查代码并根据需要推荐更改：

jQuery(".color-quantity input").each(function () {
    if (this.value) {
        quantity += (this.value) * 1;
        classname = jQuery(this).attr('class');
        arr.push(classname);
    }

    if (quantity == '') {
        quantity = 0;

    }
});

【问题讨论】：

你可以像jQuery(".color-quantity:eq(0) input")一样使用eq()
你能告诉我它是如何工作的吗？
.color-quantity:eq(0) 表示第一个 .color-quantity，.color-quantity:eq(1) 表示第二个 .color-quantity 等等...
但原因是我有超过 1000 种产品，我无法通过单独获取每个输入来手动执行此操作。
有些产品的选项更少，有些选项更多：请查看此链接：quickpro.nextmp.net/index.php/bracelets/debossed-bracelet.html

标签： javascript jquery ajax input

【解决方案1】：

您可以将每个部分的总数作为一个数组，如下所示。

var arr = $('.color-quantity').map(function () {
    var total = 0;
    $('input', this).each(function () {
        total += this.value * 1;
    });

    //do some stuff 
    if (total < 50) {
        $('.btn-cart').removeAttr("onclick");
    }

    return total;
}).get();

console.log(arr)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color-quantity">
    <input type="text" value="1">
    <input type="text" value="2">
    <input type="text" value="3">
</div>

<div class="color-quantity">
    <input type="text" value="4">
    <input type="text" value="5">
    <input type="text" value="6">
</div>

【讨论】：

您的代码完美运行，感谢它解决了我的前半部分：现在我想在每个部分分别创建一个条件，如果它们的计算数量小于某个数字则显示错误：如下：@Azim if(数量
你是救世主兄弟：一切正常，但条件运行错误:(@Azim
我可以只限制那些只选择的部分的映射，其余部分将不包括在内。现在它检查每个 1000 部分，用户必须填写每个部分 50 否则他/她无法做任何事情
我的意思是只包含那些正在输入的部分，并且条件只适用于那些被选中的部分
对选定的部分使用一个类。然后使用这个类来映射。 @Xabby

【解决方案2】：

您可以尝试嵌套循环。首先循环通过颜色数量 div，然后通过输入。像这样：

jQuery(".color-quantity").each(function () {
    var quantity = 0;
    $(this).find('input').each(function() {
        if (this.value) {
            quantity += (this.value) * 1;
            classname = jQuery(this).attr('class');
            arr.push(classname);
        }

        if (quantity == '') {
            quantity = 0;
        }

    });
    // here is where you can get the total value for each div
});

【讨论】：

您能否再解释一下我将如何计算您提到的金额：@David784