backbone.js - 将 `on`模式转换为Backbone的 `event`哈希

Question

在Backbone View 中，在initialize函数中，我执行以下操作:

initialize: function () {
    $(this.el).on('click', '.button', function () {
        $(this).fadeTo(0.5);
    }
}

这似乎违反了Backbone使用 events的约定。用 events哈希值重写:

events: { 'click .button': 'fadeButton' },
fadeButton: function () {
    $(this).fadeTo(0.5);
}

问题在于 fadeButton的范围内， this的值与使用 .on()时的值不同。使用 events哈希执行此操作的正确方法是什么？

Answer 1

就像保罗说的那样，Backbone自动将事件回调的上下文设置为 View 本身。因此，回调中的this将成为 View 实例。

因此，您可以通过使用 View 的作用域选择器功能来获得想要的效果...

events: { 
  'click .button': 'fadeButton' 
},

fadeButton: function () {
  this.$('.button').fadeTo(0.5);
}

...但是如果您的 View 中有多个带有 "button"类的元素，那么它们将全部消失，在这种情况下，您始终可以使用jQuery为您提供的事件对象来获取事件目标:

fadeButton: function (event) {
  $(event.target).fadeTo(0.5);
}