Javascript 滚动时从数据库获取图像（HTML）

我想创建一个图像库，将图像存储在数据库中。

---

假设我在页面上显示9个图像，当我向下滚动时，接下来的9个图像将显示或附加到当前的9个图像。如何使用ajax和php实现这一点。

也许您应该看看客户端中的延迟加载插件：

<ul id="images">
    <li><img src="img/test1.jpg" id="1" /></li>
    <li><img src="img/test2.jpg" id="2"/></li>
    <li><img src="img/test3.jpg" id="3" /></li>
    <li><img src="img/test4.jpg" id="4"/></li>
    <li><img src="img/test5.jpg" id="5"/></li>
</ul>

<script type="text/javascript">
    var last_image_id = $('ul#images li:last-child').attr('id');

    if($(window).scrollTop() + $(window).height() == $(document).height()) {
        $.ajax({
            url: 'loadimage.php/last_id='last_image_id,
        })
        .done(function(data) {
            $('ul#images').append(data);
        })
        .fail(function() {
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });
    }

</script>

var last_image_id=$（'ul#images li:last child'）.attr（'id'）；
if（$（窗口）.scrollTop（）+$（窗口）.height（）==$（文档）.height（））{
$.ajax({
url:'loadimage.php/last\u id='last\u image\u id，
})
.完成（功能（数据）{
$（'ul#images'）。追加（数据）；
})
.fail（函数（）{
控制台日志（“错误”）；
})
.always（函数（）{
控制台日志（“完成”）；
});
}

在服务器端：

<?php
// connect to db
$query = 'select form image_table where id > '.$_GET['last_id'].' LIMIT 9';
$result = mysqli_query($connection, $query);
$rows=mysqli_fetch_assoc($result);

foreach ($rows as $row) {
    echo '<li><img src="'.$row->image.'" alt=""></li>';
}
?>

---

尝试使用延迟加载，但没有按照我想要的方式工作。无论php回声是什么，jquery'.done（function（data）'gets？@RiverCRPhoenix jquery.done（data）获取php页面的结果并设置数据参数