javascript - 在 Backbone View 中处理图像错误事件

Question

在主干 View 使用的下划线模板中，我有一个图像。我正在尝试附加到错误事件，并在找不到原始图像时更改图像源。

基于this similar question ，我采取了以下方法:

render: function() { 
    var self = this;

    this.$el.html( this.template( { person: this.model.toJSON() } ) ); 

    this.$el.find('img.employee-image').on('error', function(evt) { this.src = "assets/images/_noimage.gif"; });

    return this;
}

这工作得很好，但是如果我尝试将 src 的更改移到 View 中的单独方法中，该方法将被调用，但图像不会更改。

render: function() { 
    var self = this;

    this.$el.html( this.template( { person: this.model.toJSON() } ) ); 

    this.$el.find('img.employee-image').on('error', function(evt) { self.handleMissingImage(evt); });

    return this;
},

handleMissingImage: function(evt) {
    // This by itself did not work.
    // this.src = "assets/images/_noimage.gif";

    var i = $(evt.currentTarget);
    i.src = "assets/images/_noimage.gif";
    console.log(i.src);
}

注销 src 显示“assets/images/_noimage.gif”，但图像不会出现。我知道它存在，因为上面概述的第一种方法效果很好。

我在这里缺少什么？

Answer 1

我认为你的问题就在这里:

i.src = "assets/images/_noimage.gif";

在您的 handleMissingImage 中你说的功能:

i = $(evt.currentTarget);

所以i是一个 jQuery 对象，而不是原始 DOM 元素。这意味着您想说 i.attr('src', ...)更改 src属性或不费心包装 evt.currentTarget完全没有。