如果有人能发现我在这里做错了什么,我会非常感激的!
我正在尝试使用此插件:http://www.sebastianoarmelibattana.com/projects/jail
我已经将它包含在我的网页中,这是一个通过AJAX请求提交并在表格中显示搜索结果的搜索表单。这个表恰好是另一个名为dataTables的插件。
以下是相关的代码位:
AJAX请求成功完成后插件的重新初始化(在实际的HTML页面中也进行了相同的初始化):
// re-initialise lazyload, lightbox and dataTable plugins
$('img.lazy').jail();
$('a.lightbox').lightBox();
$('#test-docs-table').dataTable( {
"bPaginate": false,
"sDom": 'Rlfrtip',
"aoColumns": [
null,
null,
{ "sType": "title-numeric" },
null
]
});
这是php的一行,显示了包含缩略图的相关表格单元格:
$shortname = $row['filename'];
$doc = "/central/testdocs/".$row['filename'];
$thumb = "include/doc-thumbnail.php?doc=$doc";
echo("'n<div class='"thumbnail'">'n<td class='"center'"><a class='"lightbox'" title='"$shortname'" href='"$thumb&dpi=96'"><img class='"lazy'" data-href='"$thumb'" src='"images/blank.png'" width='"50'" height='"50'"/></a></td>'n</div>'n");
请注意,涉及到另一个插件-lightbox,所以不确定这是否会影响情况。
目前,看起来JAIL插件正在做一些的事情,但页面一加载,所有图像都会立即加载。
当你点击缩略图时,灯箱仍然可以工作——页面实际上和以前一样工作,只是在页面完全加载之前,缩略图单元格是空的。
我发现了错误,最愚蠢的事情!
因为我试图使用最初的懒惰加载插件,所以我在CSS中有一条现有的规则来隐藏类懒惰的图像,所以插件无法做到这一点。
如果其他人遇到这个问题,那该怎么办!