骨干点击事件中断答案

【问题标题】：Backbone Click Events Breaking骨干点击事件中断
【发布时间】：2012-06-20 00:15:24
【问题描述】：

我正在使用 Node 作为后端在 Backbone 中构建一个应用程序。作为应用程序的一部分，我正在处理我的视图上的点击事件。一个例子是这样的：

window.MyView = Backbone.View.extend({
   tagName: 'section',
   className: 'calls',

   events: {
      'click a.first': 'gotoFirst',
      'click a.prev': 'gotoPrev',
      'click a.next': 'gotoNext',
      'click a.last': 'gotoLast',
      'click a.page': 'gotoPage'
   },

当我第一次加载视图并单击时，一切正常（单击事件得到正常处理）。但是，如果我导航到新视图，然后返回到第一个视图，则单击事件会中断。

通过导航到新视图，我的意思是我会执行以下操作：

$container.empty();    
$container.append(window.myNewView.render().el);

然后我就这样回去了：

$container.empty();
$container.append(window.myView.render().el);

但是当我重新渲染视图时，我的点击事件被破坏了。我怎样才能解决这个问题？提前致谢！

【问题讨论】：

标签： jquery node.js javascript-events backbone.js

【解决方案1】：

当您通过调用 .empty() 删除视图时，您正在中途破坏 DOM 事件。但在重新显示视图时不会自动重新附加它们。

您必须跳过铁环才能重新连接它们。阅读：

http://tbranyen.com/post/missing-jquery-events-while-rendering

更好的答案是不要重复使用视图实例。每次需要显示视图时创建一个新的视图实例。

【讨论】：