Question

我得到了以下示例Backbone.View：

var View = Backbone.View.extend({
  tagName: "div",

  className: "advertisement",

  initialize: function () {
    this.on('switch', this.
    switch, this);

    this.views = {};
    this.views.laptop = new LaptopAdView();
    this.views.piano = new PianoAdView();
    this.views.food = new FoodAdView();
  },

  render: function () {
    this.$el.empty();
    this.
    switch ('laptops');

    return this;
  },

  switch: function (ad) {
    var el;

    if (ad === 'laptop') {
      el = this.views.laptop.render().el;
    } else if (ad === 'piano') {
      el = this.views.piano.render().el;
    } else {
      el = this.views.food.render().el;
    }

    // reinsert the chosen view
    this.$el.empty().append(el);
    // bind all events new
    this.delegateEvents();
  }
});

如您所见，我使用this.delegatEvents（）重新创建所有事件绑定。这实际上不是一个完美的解决方案......当我使用它时会好得多。$ el.detach（）;或者其他方法，所以我用事件缓存整个对象，而不是重新渲染和重新创建所有事件。

现在有了工作小提琴： http://jsfiddle.net/RRXnK/66/

Answer 1

您正在尝试绑定到Backbone视图而不是DOM元素：

this.on('switch', this.switch, this);

一切都很好，但谁会触发“切换”事件？您没有触发DOM事件的绑定，this.delegateEvents();仅适用于DOM事件。

设置DOM事件后，例如

this.$el.on('click', 'a', this.switch) - 将触发'switch'事件，只要$ el未从DOM中删除，您就不必重新委派事件。

通过保留事件而不是创建新事件，将Backbone.View重新注入DOM

1 个答案: