我正在开发一个缩略图库,使用下划线模板填充JSON数据。只想使用新的Image()对象为缩略图图像添加图像预加载器。
请在我出错的地方纠正我,因为以下代码对我不起作用。还建议我的方法是否正确。
<!-- Template for Thumbnail GRID -->
<script type="text/template" id="grid-listing-template">
<% if(!_.isUndefined(data)) {
var images = [];
_.each(data, function(result, i) {
%>
<div class="col-6 col-sm-6 col-lg-4 item">
<div class="thumbnail">
<a href="<%=result.href%>" title="<%=result.title%>">
<div class="loader" style="display:block; height: 100px;"></div>
<img class="img-responsive thumb" src="" alt="<%=result._alt%>" style="display: none;">
<%
images[i] = new Image();
images[i].src = result._src;
images[i].onload = function() {
$('.thumb').attr('src',result._src);
$('.thumbnail .loader').remove();
};
%>
<div class="caption">
<p><%=result.caption%></p>
</div>
</a>
</div>
</div>
<%
});
%>
<% } %>