javascript - jQuery - 从加载的内容加载内容 - .load

Question

我正在尝试在加载各个产品链接后加载特定信息。

我拥有什么及其用途:

$(function(){
    $('.prdContainer .prdHero').each(function(i){
        $(this).load(('http://www.domain.com .product:nth-child(' + (i + 1)+ ') .productMainImage'), function(){
            $('.prdContainer .prdDesc').each(function(){
                var prdLink = $('.prdHero .productMainImage').attr('href');

                $(this).load(prdLink + ' ' + '.productHeading');
            });
        });
    });
});

1 - 函数将产品加载到 .prdHero - 3x

2 - 函数获取链接并添加到新的.load

3 - 然后这应该加载到特定于产品的标题中，但所有 3 个标题都加载到相同的标题中(第一个)。

我觉得我需要使我的函数特定于 .prdContainer 并使用 $(this)，我只是不确定如何？

Answer 1

如果没有显示特定的 HTML，我必须猜测您的层次结构，但是类似这样的内容将使用已知的父元素作为每个搜索的起点:

$(function(){
    $('.prdContainer .prdHero').each(function(i){
        var $parent = $(this).closest('.prdContainer');
        $(this).load(('http://www.domain.com .product:nth-child(' + (i + 1)+ ') .productMainImage'), function(){
            $parent.find('.prdDesc').each(function(){
                var prdLink = $parent.find('.prdHero .productMainImage').attr('href');
                $(this).load(prdLink + ' ' + '.productHeading');
            });
        });
    });
});

正如评论中提到的，您似乎正在进行太多的 Ajax 调用。也许展示整体问题会带来更好的解决方案？