2

我正在尝试在主干应用程序中使用此延迟加载插件，我调整了模板以与插件一起使用并调用了插件脚本，但它不起作用。这是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();
});

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

4

2 回答 2

1

首先，您在小提琴中使用了错误的插件路径。它不起作用的另一件事与您放置插件初始化的位置有关。您在准备好的文档上对其进行初始化，但您的图像尚未呈现。所以你必须在渲染视图后初始化插件（当图像被添加到 DOM 时）。

于 2013-08-21T20:21:14.510 回答
1

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

新的功能

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

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

编辑：

为了使整个示例工作，我将揭幕调用移至视图渲染函数（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;
  }
});
于 2013-08-22T06:38:54.110 回答