ajax成功后点击事件的jQuery Fancybox显示没有图像

Posted 2023-05-09

【中文标题】ajax成功后点击事件的jQuery Fancybox显示没有图像

【英文标题】：jQuery Fancybox on click event after ajax success shows no images

【发布时间】：2021-07-19 17:37:24

【问题描述】：

在 ajax 请求的成功区域，我通过 jQuery 添加了一个 onClick eventListener 来打开 fancybox。画廊的对象被接收并通过数据属性传递。

jQuery.ajax(
    type: "post",
    dataType: "json",
    url: ajax_url,
    data: data,
    success: function( response ) 
        
        poi_images = '';
        if(poi_data['images'] !== undefined) 
            poi_gallery_class = 'poi-gallery';
            poi_images = JSON.stringify(poi_data['images']);
        

        // [...]
        
        
        $('.poi-gallery').on('click', function() 

            gallery = $(this).attr('data-gallery');
            gallery = JSON.parse(gallery);

            console.log(gallery);

            $.fancybox.open(
                gallery, 
                helpers : 
                    thumbs : 
                        width: 75,
                        height: 50
                    
                ,

            );
        );    
    
);

fancybox 画廊打开，在画廊中显示正确数量的图像，但没有显示任何图像。 Container还是空的，fancybox镜像的src还是空的。

我做错了什么？

【参考方案1】：

发现图像 url 的键名必须命名为“src”而不是“href”。