Javascript for循环索引从最大数开始

Question

我需要一个关于如何解决这个问题的解决方案。 javascript 循环函数在 AJAX return 函数中无法正常工作。

 var selectedColor = '';
var selectedSize = '';
var selectedQuantity = '';
var productID = '';
var indexCount;
$('.up-cart').on('click', function() {
    var cartRows = $('.cartRows').length;
    for (indexCount = 0; indexCount <= cartRows; indexCount++) {
        $('.myOrderSettings [name="selectedColor' + indexCount + '"]').each(function() {
            if ($(this).prop("checked")) {
                if (selectedColor == "") {
                    selectedColor += $(this).val();
                } else {
                    selectedColor += ',' + $(this).val();
                }
            }
        });
        $('.myOrderSettings [name="selectedSize' + indexCount + '"]').each(function() {
            if ($(this).prop("checked")) {
                if (selectedSize == "") {
                    selectedSize += $(this).val();
                } else {
                    selectedSize += ',' + $(this).val();
                }
            }
        });
        $('.myOrderSettings [name="selectedQuantity' + indexCount + '"]').each(function() {
            if ($(this).val() < 1) {
                selectedQuantity = '1';
                alertMe("Your order quantity has been set to 1", 5000);
            }
            if (parseInt($(this).val()) > parseInt($(this).attr('max'))) {
                selectedQuantity = $(this).attr('max');
                alertMe("We have " + $(this).attr('max') + " of this product. Your order quantity has been set to " + $(this).attr('max'), 5000);
            } else {
                selectedQuantity = $(this).val();
            }
        });

        productID = $('.myOrderSettings [name="productID' + indexCount + '"]').val();

        $.ajax({
            url: "<?php echo base_url() ?>cart/updateCart",
            type: "post",
            dataType: "json",
            data: {
                selectedColor: selectedColor,
                selectedSize: selectedSize,
                selectedQuantity: selectedQuantity,
                productID: productID
            },
            success: function(data) {
                console.log(indexCount);
                $('.myOrderSettings .t-total' + indexCount).html(formatMoney(parseInt(data.cart_amount)));
            }
        });
        calculateTotalAmount();
        selectedColor = "";
        selectedSize = "";
        selectedQuantity = "";
        productID = "";
    }

});

我在控制台得到的结果是6，同时我总共有5行。这阻碍了我分别 return 将结果传递给对象。 Check the result in the console

Answer 1

我刚刚解决了这个问题，我注意到 async 没有设置为 false，所以这是我的解决方案。但欢迎其他解决方案。

var selectedColor = '';
var selectedSize = '';
var selectedQuantity = '';
var productID = '';
var indexCount;
$('.up-cart').on('click', function() {
    var cartRows = $('.cartRows').length;
    for (indexCount = 0; indexCount <= cartRows; indexCount++) {
        $('.myOrderSettings [name="selectedColor' + indexCount + '"]').each(function() {
            if ($(this).prop("checked")) {
                if (selectedColor == "") {
                    selectedColor += $(this).val();
                } else {
                    selectedColor += ',' + $(this).val();
                }
            }
        });
        $('.myOrderSettings [name="selectedSize' + indexCount + '"]').each(function() {
            if ($(this).prop("checked")) {
                if (selectedSize == "") {
                    selectedSize += $(this).val();
                } else {
                    selectedSize += ',' + $(this).val();
                }
            }
        });
        $('.myOrderSettings [name="selectedQuantity' + indexCount + '"]').each(function() {
            if ($(this).val() < 1) {
                selectedQuantity = '1';
                alertMe("Your order quantity has been set to 1", 5000);
            }
            if (parseInt($(this).val()) > parseInt($(this).attr('max'))) {
                selectedQuantity = $(this).attr('max');
                alertMe("We have " + $(this).attr('max') + " of this product. Your order quantity has been set to " + $(this).attr('max'), 5000);
            } else {
                selectedQuantity = $(this).val();
            }
        });

        productID = $('.myOrderSettings [name="productID' + indexCount + '"]').val();

        $.ajax({
            url: "<?php echo base_url() ?>cart/updateCart",
            type: "post",
            dataType: "json",
            async: false,
            data: {
                selectedColor: selectedColor,
                selectedSize: selectedSize,
                selectedQuantity: selectedQuantity,
                productID: productID
            },
            success: function(data) {
                console.log(indexCount);
                $('.myOrderSettings .t-total' + indexCount).html(formatMoney(parseInt(data.cart_amount)));
            }
        });
        calculateTotalAmount();
        selectedColor = "";
        selectedSize = "";
        selectedQuantity = "";
        productID = "";
    }

});

Answer 2

发生这种情况是因为您正在从 0 迭代到 cartRows。它需要比 cartRows.

小 0 比 1

....
for (indexCount = 0; indexCount < cartRows; indexCount++) {

//Your code

}

cartRows 存储 length 个 $('.cartRows')。 In Javascript .length returns 数组中存在的元素数。 当您迭代时，您的 for 循环应该迭代 $('.cartRows').lenght 个元素次。

当您从 0 开始索引到 <= $('.cartRows').length 时，您的 for 循环将迭代长度 + 1 次（因为 <=）

Javascript for循环索引从最大数开始

Javascript for loop index starting from the max number

javascript

cart