javascript - jQuery 计算特定 div 中的 div,然后在添加新 div 时重置计数

标签 javascript jquery

我使用 .each 来计算另一个 div 内的 div,但我有多个具有相同类的 div,并且我想为每个新的 div 包装器从 0 开始计数。

抱歉,这有点难以解释,所以这里有一个 jsFiddle 工作的链接:https://jsfiddle.net/1nds1put/

1.) 点击“添加季节性价格过滤器”

2.) 点击“添加价格规则”,您会看到它显示“价格规则#1”(工作正常)

3.) 再次点击“添加价格规则”,您会看到它显示“价格规则#2”(仍然正常工作)

4.) 再次点击“添加季节性价格过滤器”

5.) 在新的季节性价格过滤器中点击“添加价格规则”,您会看到它显示“价格规则#3”(不起作用,我希望它显示“价格规则#1”,因为它位于不同的div)

这是计算数字/计数器的函数:

function recacluclate() {

        $( ".price-rule-wrapper-outer").children('div').each(function(index) {
            $(this).find('.price-rule-number span').text(index + 1);
        });

        $( ".seasonal-filter-wrapper-outer").children('div').each(function(index) {
            $(this).find('.seasonal-filter-number span').text(index + 1);
        });

        $( ".seasonal-filter-wrapper-outer .price-rule-wrapper-outer").children('div').each(function(index) {
            $(this).find('.price-rule-number span').text(index + 1);
        });

        $( ".price-rule-wrapper-outer").children('div').each(function(index) {
            $(this).find('.standard-adult-weekday').attr('name', 'standard-adult-weekday-' + (index + 1));
            $(this).find('.standard-adult-weekend').attr('name', 'standard-adult-weekend-' + (index + 1));
            $(this).find('.standard-child-weekday').attr('name', 'standard-child-weekday-' + (index + 1));
            $(this).find('.standard-child-weekend').attr('name', 'standard-child-weekend-' + (index + 1));
        });

    }

非常感谢任何帮助!

最佳答案

替换

$( ".seasonal-filter-wrapper-outer .price-rule-wrapper-outer").children('div').each(function(index) {
    $(this).find('.price-rule-number span').text(index + 1);
});

$(".seasonal-filter-wrapper-outer .price-rule-wrapper-outer").each(function() {
  $(this).children('div').each(function(index) {
    $(this).find('.price-rule-number span').text(index + 1);
  });
})

关于javascript - jQuery 计算特定 div 中的 div,然后在添加新 div 时重置计数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45277746/

相关文章:

javascript - AJAX/PHP ajax 数据/回显返回 "?>"

javascript - PDF在Safari中隐藏Jquery Modal

javascript - 如何使用 jQuery 在 for 循环的迭代中连续添加变量?

javascript - 为什么一些 jQuery 程序员使用 jQuery 函数,如 $.get、$.getJSON 和 $.when 而不是 $.ajax

javascript - 简单的 Javascript 函数不适用于 .ascx 文件

javascript - AngularJS:$emit 方法发送重复数据

javascript - Tablesorter JS 无法实现奇数/偶数

javascript - 我 << 1 在 Javascript 中是什么意思?

javascript - 将 C 编译为 wasm,使用与 WasmFiddle 相同的设置

jquery - ASP.NET MVC : custom ViewModel form post