使用Ajax延迟加载 - Using Ajax lazy load

Using Ajax lazy load

本文关键字：延迟加载 Ajax 使用 | 更新日期: 2023-09-27

我创建了一个数据库，用于存储所有图像的名称，以便稍后检索它。为了检索图像的名称，我使用ajax并将其与<img>标记绑定:

$.post('image_name.php',{id:id}, function(data){
   $('#container').html('<img src="img/'+data+'">');
});

一切都很好。但我注意到的是，所有的图像同时出现，这稍微减慢了这个过程。因此，我认为处理这个问题的最好方法是使用延迟加载。我想要准备显示的任何数据....但我不知道该怎么做。

附加信息:我正在尝试创建一个缩略图列表。就像Imgur侧边栏(https://i.stack.imgur.com/BbtPn.jpg)

如果您计划创建一个带有左右键的列表:

与ajax获取数组下6个图像。只有名称或id。
ajax成功
- 为图像数组$(array)创建一个循环。jquery中的每一个都很好!
- 在循环周期设置一个时间定时器(http://archive.plugins.jquery.com/project/timers是伟大的)为每个图像。使用数组索引* Interval * 1000 (1000ms for 1 sec)

整体思路是:

onsuccess:
    $(whatyougotfromajax).each(function(index, value)
    {
        $.oneTime(index * Interval * 1000, function()
        {
            $('#block').append('<img src="sth.php?Id=' + value + '">');
        });
    });

我不确定…不，我确定它不是这样工作的，但是你已经明白了