虽然使用 ajax prettyphoto 加载更多图像不起作用答案

【问题标题】：while load more image using ajax prettyphoto not work虽然使用 ajax prettyphoto 加载更多图像不起作用
【发布时间】：2018-04-14 22:34:15
【问题描述】：

一开始我加载了 3 张照片，单击“加载更多”后，其他 3 张照片由 ajax 获取但是当我点击这张取来的照片时，漂亮的照片不起作用它不会打开集成的图像滑块，它只是以全尺寸打开图像..（就像普通链接一样）并且控制台没有显示任何错误。

你可以在下面找到脚本：

<script type="text/javascript">
    $( document ).on( 'click', '.loadmore', function () 
    {
        $(this).text('Loading...');
        var ele = $(this).parent('li');
        $.ajax({
            url: 'loadmore.php',
            type: 'POST',
            data: 
            {
                page:$(this).data('page'),
            },
            success: function(response)
            {
                if(response)
                {
                    ele.hide();
                    $(".news_list").append(response);
                }
            }
        });
    });
</script>

提前感谢您的帮助...

【问题讨论】：

请编辑问题，它不可读。
ZOOM 我在 loadmore.php 中写了这段代码来打开 prettyphoto
改进格式和拼写
如何初始化漂亮的照片？必须有另一个脚本
请查看我的完整代码。africaglobalnetwork.com/event/test.zip

标签： php ajax prettyphoto

【解决方案1】：

由于您将动态项目添加到 dom，因此您必须重新初始化您的 Pretty Photo 实例。

类似的东西应该可以工作

$( document ).on( 'click', '.loadmore', function () 
{
    $(this).text('Loading...');
    var ele = $(this).parent('li');
    $.ajax({
        url: 'loadmore.php',
        type: 'POST',
        data: 
        {
            page:$(this).data('page'),
        },
        success: function(response)
        {
            if(response)
            {
                ele.hide();
                $(".news_list").append(response);
                $("a[rel^='prettyPhoto']").prettyPhoto();
            }
        }
    });
});

【讨论】：