Question

我正在尝试在骨干应用程序中使用此lazy loading plugin，我调整了模板以使用插件并调用插件脚本但它不起作用。这是jsfiddle：http://jsfiddle.net/swayziak/9R9zU/27/

模板：

<script id="bookTemplate" type="text/template">
    <img src="https://www.amrms.com/ssl/iftafoundation/bluepay/Images/Loading_Animation.gif" data-src="<%= image %>"/>
    <h2 class="bookTitle"><%= title %><h2>
</script>

文档就绪的脚本：

$(document).ready(function() {
    $("img").unveil();
});

我不知道我的代码有什么问题。

Answer 1

首先，你在小提琴中使用了不正确的插件路径。它无法正常工作的另一个原因与插件初始化的位置有关。您在文档准备就绪时初始化它，但您的图像尚未渲染。因此，您必须在渲染视图后初始化插件（将图像添加到DOM时）。

Answer 2

您对Zepto版本有疑问，请使用在zepto最新版本中更新的过滤功能:(来自http://zeptojs.com/#changelog）

新功能

 $.fn.filter(function(index){ ... })

查看使用http://jsfiddle.net/9R9zU/41/来源的更新jsfiddle（http://zeptojs.com/zepto.js）。

编辑：

使整个示例工作我将展开调用移动到视图渲染函数（http://jsfiddle.net/9R9zU/52/）

app.BookView = Backbone.View.extend ({
  tagName: 'div',
  className: 'book',
  template: _.template( $( '#bookTemplate' ).html()),
  render: function() {
    this.$el.html(this.template(this.model.toJSON()));
    this.$el.find("img").unveil();//for every render we run the lazy loader
    return this;
  }
});

使用Backbone的延迟加载

2 个答案: