javascript - ajax调用后如何重新初始化lightgallery

Question

我正在使用 lightgallery 插件在点击时显示我的网站的图像。我将灯光画廊初始化为

$(document).ready(function(){
    $('#lightgallery').lightGallery({
        selector: '.item'
    });
});

在文件加载它的工作正常。问题是当我加载更多图像并使用 jquery 附加它们时，我想再次重新初始化 lightgallery 以处理由 ajax 调用加载的 iamges。但灯光画廊对他们不起作用。它仅适用于页面加载时加载的图像。

Answer 1

这可能会有所帮助：

function createLightGallery()
{
    $('#lightgallery').lightGallery({
        selector: '.item'
    });
}

// on document load
$(document).ready(function(){
    createLightGallery();
});

// on the AJAX request
$.ajax({ 
    url: "/get_images",
    .
    .
    success: function()
    {
         if("#lightgallery").data("lightGallery"))
             $("#lightgallery").data("lightGallery").destroy(true);
         createLightGallery();
    }
});

Answer 2

这是我在ajax中工作的答案

成功：函数（）{

//destroy your lightgallery
 try{ $('#lightgallery').lightGallery(); $('#lightgallery').data('lightGallery').destroy(true); }catch(ex){};

//and then re-initiate gallery again
$('#lightgallery').lightGallery({
    selector: '.item'
});

}