3

我正在为骨干.js 苦苦挣扎。我对 js 很陌生,并且习惯了 as3 什么是面向对象的

我尝试用主干制作一个简单的图片库。我加载了 100 张图像,如果它们被加载,我希望它们淡入。

我的 AppView 中有这个。对于我得到的每个图像网址,我都会创建一个 PhotoView

var view = new PhotoView({model: photo, list:this.imageList});
this.imageList.append(view.render().el);

在 Photoview 中,我使用此代码将 onload() 附加到 img 标签上(在此处找到):

render: function() {
    var self = this;
    this.$el.append(some_html_with_img_elements);
    this.$el.find('img').on('load', function() { self.img_loaded() });
    return this;
}

问题是在 img_loaded() 我一遍又一遍地得到相同的视图(最后一个视图)。任何人都知道如何保持对正确视图的引用

4

2 回答 2

3

this作为参数传递给img_loaded,以便您获得对刚刚加载的图像的引用,并根据需要对其进行操作。

由于您没有发布该img_loaded函数的代码,我不确定您是否尝试在每个加载时一次淡化它们(一旦您传入图像参考,这是一项简单的工作),或者等到它们'全部加载并立即将它们全部淡入(需要一些额外的代码)。

于 2013-02-21T13:48:32.817 回答
0

您可以将视图的引用传递给这样的回调函数。

var me = this;
me.$el.find("img").on("load", { me: me }, function (event) { event.data.me.img_loaded(); });
于 2013-04-25T21:34:13.010 回答