Question

事件在骨干

的附加视图中不起作用

这是视图的方法：

events: {
  'click .toolbar_ship': 'openProfile'
},
openProfile: function() {
  gameView.$el.append(profileView.render().$el);
}

这里是个人资料：

events: {
  'click .object_in_inventory': 'inventoryClick',
  'click .object_in_cell': 'cellClick',
  'click .close_profile': 'closeProfile'
},
render: function() {
  this.$el.html(this.template());
  return this;
},
closeProfile: function() {
  this.$el.remove();
}

在第一个配置文件中正确添加并且点击上的所有绑定都很好，但是当我关闭配置文件然后打开一个时，没有任何点击工作。

我甚至无法理解为什么会这样，我将非常感谢你的帮助。

这是点击的一个例子：

$('.wrapGate').bind('click', function() {
.....
}

谢谢）

Answer 1

您的问题来自openProfile方法的实现。

您正在使用profileView的实例，您已将其初始化为

var profileView = new ProfileView();

ProfileView从Backbone.View延伸，当您初始化时delegate events 并将它们绑定到this.$el。

当您在remove()上调用jQuery的this.$el方法时，它会将其删除并解除所有附加事件的绑定。

下次当您致电openProfile时，profileView.render().$el会返回您的观看但没有任何活动。

要避免这种情况，您需要重构代码。在某些情况下，您可以如何实施此任务。其中之一是始终使用ProfileView的新实例，如：

events: {
  'click .toolbar_ship': 'openProfile'
},
openProfile: function() {
  var profileView = new ProfileView();
  gameView.$el.append(profileView.render().$el);
}

并在ProfileView中：

events: {
  'click .object_in_inventory': 'inventoryClick',
  'click .object_in_cell': 'cellClick',
  'click .close_profile': 'closeProfile'
},
render: function() {
  this.$el.html(this.template());
  return this;
},
closeProfile: function() {
  this.remove(); // this.remove() is the method of Backbone.View, which will manage removing of view and unbinding of events.
}

另一种解决方案是在用户点击关闭个人资料时隐藏个人资料视图

events: {
  'click .toolbar_ship': 'openProfile'
},
openProfile: function() {
  if (this.profileView) {
      this.profileView.$el.show(); // your custom showing logic
  } else {
      this.profileView = new ProfileView(); // caching profileView
      gameView.$el.append(profileView.render().$el);
  }

}

并在ProfileView中：

events: {
  'click .object_in_inventory': 'inventoryClick',
  'click .object_in_cell': 'cellClick',
  'click .close_profile': 'closeProfile'
},
render: function() {
  this.$el.html(this.template());
  return this;
},
closeProfile: function() {
  this.$el.hide(); // your custom showing logic
}

当您不再需要时，不要忘记管理ProfileView删除和事件解除绑定。

Answer 2

这是由于你的＆＃34; el＆＃34;财产，你附加的观点应该在你的内部

eg: el : "#container" // must set

    <div id="container">
      .
      .
      .
      .
   <div id="new-appended-views"></div>
     .
     .
    </div>

事件将适用于所有新附加的视图

事件在附加视图中不起作用

2 个答案: