为什么在Backbone.js的第二次渲染后事件没有触发？

Question

我正在使用Backbone.js创建一个应用程序，该应用程序具有父视图和多个子视图。子视图包含它们监听并执行功能的链接。

父视图存储所有子视图的列表。在渲染函数完成计算自己的HTML之后，它执行以下操作：

$(this.el).html(html);
for (var i = 0; i < this.views.length; i++){
    $('.children', this.el).append(this.views[i].render().el);
}

答案: 问题在于我是在渲染期间创建链接的。也就是说，在第一次渲染时（从init中调用），事件成功绑定到了链接上。但是，由于所有后续的渲染调用都会重新创建整个元素，新链接没有将处理程序绑定到它上面。这通过@Tom Tu的解决方案，将this.delegateEvents() 添加到渲染中得以解决。

- chacham15

Answer 1

你可能在某个地方使用了jquery的remove函数来移除视图中的子视图 - 它会自动删除所有绑定到元素(this.el)上的事件，这些事件在events对象中设置。你可以在渲染子视图后，在this.delegateEvents()方法中重新绑定在events对象中设置的事件委托，或者使用jquery的detach方法将元素从DOM中移除而不删除事件绑定（链接）。delegateEvents方法负担较重，因此如果您正在渲染大量的子视图并且希望重复使用要删除的元素，则建议使用detach方法 - 如果只是几个视图，则无关紧要。

另一个可能性是您已经错误地设置了events对象 - 根据提供的代码量很难确定，但我猜是第一个问题。

- Tom Tu

---

添加了更多细节，希望有所帮助。 - Tom Tu

那是一个非常好的想法，但我已经添加了删除代码。此外，事件不能设置错误，否则它将无法触发。 - chacham15

Answer 2

一个非常普遍的问题。对于将来会发现这个问题的人，这是一篇关于视图渲染的好文章:

你只需要确保在每次.html()运行时调用delegateEvents来重新绑定子视图上的事件。由于Backbone的setElement已经调用了delegateEvents，因此快速解决方案可能是这样的...

http://ianstormtaylor.com/rendering-views-in-backbonejs-isnt-always-simple/

- SimplGy

---

那正是我一直在寻找的。谢谢！ - Emile Bergeron