让 Lightbox 与相册中的 AJAX 配合使用

Question

所以我在弄清楚如何使以下脚本工作方面遇到了一些真正的困难。它将 Facebook 相册加载到页面上，但随后我需要调用 $("a.fancied").fancybox(); 才能使灯箱工作。

下面的代码尝试将此行作为 getJSON() 的回调来执行，但我对这方面还是个新手，只是无法弄清楚为什么它不起作用。

如果我在所有内容都加载后在控制台中输入 $("a.fancied").fancybox(); 则没有问题。

正在运行的网站：http://bagsoffunkansascity.org/white-party-2011.html

 <div id="FBalbum"></div> 
    <script> 
    $(document).ready(function() {

        var AlbumID = "206175519447064";

        var graph = "https://graph.facebook.com/" + AlbumID + "/photos?callback=?";        
        $.getJSON(graph, function(data) {
            var albumItem = [];
            $.each(data, function(key, val) {
                $.each(val, function(key2, val2) {
                    if (val2.source != undefined){
                        albumItem.push(
                            '<li id="' + key2 + '"><a class="fancied" href="' + val2.source + '"><img src="' + val2.picture + '" /></a></li>'
                        );
                    }
                }); 
            });        
            $('<ul />', {
                'class': 'album',
                html: albumItem.join('')
            }).appendTo('#FBalbum'); 
        }, function(){
           $("a.fancied").fancybox();
       });    
    });
    </script> 

谢谢！

Answer 1

尝试这个代码，对我有用：

<script> 
$(document).ready(function() {

    var AlbumID = "206175519447064";

    var graph = "https://graph.facebook.com/" + AlbumID + "/photos?callback=?";        
    $.getJSON(graph, function(data) {
        var albumItem = [];
        for(var key in data){
            for(var key2 in data[key]){
                val2=data[key][key2];
                if(typeof(val2.source)!="undefined"){
                    albumItem.push(
                        '<li id="' + key2 + '"><a class="fancied" href="' + val2.source + '"><img src="' + val2.picture + '" /></a></li>'
                    );
                }
            }
        }
        $('<ul />', {
            'class': 'album',
            html: albumItem.join('')
        }).appendTo('#FBalbum'); 
       $("a.fancied").fancybox();
    });    
});
</script>

基本上 $.each 是异步的，当您创建 albumItem 时是空的。

如果您还需要什么，请告诉我。

干杯

G。