jquery-databables 中的 jquery-lazyload 图像 [英] jquery-lazyload images in jquery-databables

问题描述

使用 datatables javascript 插件我想在带有分页的表格中显示 10k 小图像.
因为我加载了太多，所以我会出错.

With the datatables javascript plugin I want to display 10k little images in a table with pagination.
Because I load too much of them, I get errors.

我只想在这些图像出现时加载它们，所以我找到了 lazyload 插件.

I would like to load those images only when they appear so I found the lazyload plugin.

但是，图像一开始根本没有出现.
我必须手动输入

However, the images don't appear at all at first.
I have to manually enter

$("img.lazy").lazyload();

在浏览器控制台中.
然后只加载屏幕上的图像
(即当我向下滚动时，我看到所有其他图像都已卸载).
这至少证明了插件在某种程度上是有效的.

in the browser console.
Then only it loads the images that are on screen
(i.e. when I scroll down, I see all other images unloaded).
This proves at least that the plugin is somewhat working.

数据表的使用有什么特别的吗?
我是否必须每秒按脚本触发延迟加载?

Is there something particular to do with the use of datatables?
Do I have to scriptually trigger lazyload every second?

谢谢！

推荐答案

我找到了另一种方法 此处 没有延迟加载插件.
使用选项

I found another method here without the lazyload plugin.
Use the option

"fnRowCallback": customFnRowCallback

然后这个函数会用图片标签替换第一列.

and then this function will replace the first column with an image tag.

function customFnRowCallback( nRow, aData, iDisplayIndex )
{
    $('td:eq(0)', nRow).html( '<img class="" src="http://aaaaa/'+ aData.attribute+'" alt="" />' );
    return nRow;
}

这篇关于jquery-databables 中的 jquery-lazyload 图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！