.load () используется не для каждого объекта - PullRequest
Новая
       12

.load () используется не для каждого объекта

0 голосов
/ 07 сентября 2011

Я пытаюсь загрузить контент с подстраниц, а затем добавить атрибут rel для галереи, требуемой плагином prettyPhoto. После запуска сценария rel добавляется только в последний набор изображений. \

HTML 

<div class="prettyphotothumb">
    <ul class="navsub">
    <li><a href="album.html"><img src="images/thumbnail.jpg" alt="" />Album</a></li>
    <li><a href="blarg.html"><img src="images/thumbnail.jpg" alt="" />Blarg</a></li>
    <li><a href="test.html"><img src="images/thumbnail.jpg" alt="" />Test</a></li>
    </ul>
</div>

JS 

if($('div.prettyphotothumb').length > 0) {
    $('div.prettyphotothumb a').each(function() {
        var pageLink = $(this);
        var albumTitle = $(pageLink).text();
        var album = $('<div class="album"></div>').appendTo( $(pageLink).parent());

        $('.album').load(this.href+' .prettyphotoalbum p > *',null,function(){  
            album.children('a').attr('rel','prettyPhoto['+albumTitle+']');
        });

        $('a[rel^="prettyPhoto"]').live("click",function() {
            $.prettyPhoto.open($(this).attr("href"),"","");
            return false;
        });         

    }); 
}

1 Ответ

2 голосов
/ 07 сентября 2011

Когда вы выполняете итерацию, используя each, вы добавляете <div class="album"> на каждую итерацию: 

var album = $('<div class="album"></div>').appendTo( $(pageLink).parent());

И затем прямо под этим: 

$('.album').load(//...

На первомитерация, $('.album').length будет одна, на второй будет две и т. д. Последняя итерация в итоге вызовет .load('test.html .prettyphotoalbum p > *', ... для всех трех <div class="album"> добавленных вами элементов.

Я думаюВы хотите просто связать load с тем, что вы только что создали: 

// Use album rather than $('.album')
album.load(this.href+' .prettyphotoalbum p > *',null,function(){  
    album.children('a').attr('rel','prettyPhoto['+albumTitle+']');
});

Кроме того, вам нужен только один вызов .live, поэтому переместите это: 

$('a[rel^="prettyPhoto"]').live("click",function() {
    $.prettyPhoto.open($(this).attr("href"),"","");
    return false;
});

за пределы.each.Так что-то вроде этого должно работать лучше: 

if($('div.prettyphotothumb').length > 0) {
    $('div.prettyphotothumb a').each(function() { 
        var pageLink   = $(this);
        var albumTitle = $(pageLink).text();
        var album      = $('<div class="album"></div>').appendTo($(pageLink).parent());

        album.load(this.href+' .prettyphotoalbum p > *', null, function() { 
            album.children('a').attr('rel', 'prettyPhoto[' + albumTitle + ']');
        });
    });

    $('a[rel^="prettyPhoto"]').live("click", function() {
        $.prettyPhoto.open($(this).attr("href"), "", "");
        return false;    
    });
}
...