我正在开发一个缩略图库,该库使用下划线模板填充 JSON 数据。只想使用 new 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>
<%
});
%>
<% } %>