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

我在Backbone.js中创建了一个具有父视图和多个子视图的应用程序。 子视图包含他们收听并执行function的链接。

父级存储所有子视图的列表。 在render函数中,在完成计算自己的html之后,它会执行以下操作:

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

答案:问题是我在渲染过程中创建了链接。 即第一次渲染(从init调用),事件成功绑定到链接。 但是,由于所有后续的render调用都会重新创建整个元素,因此新链接没有绑定到它的处理程序。 这是通过@Tom Tu解决方案解决的,该解决方案将this.delegateEvents()添加到渲染中

您可能正在某处使用jquery remove函数从视图中删除子视图 – 它会自动删除绑定到元素(this.el)的所有事件 – 在events对象中设置。 您可以在渲染模板后使用this.delegateEvents()方法渲染子视图,以重新绑定events对象中设置的事件委托,或者使用jquery detach方法代替从DOM中删除元素而不删除事件绑定( 链接 )。 delegateEvents方法非常昂贵,因此我建议使用detach方法删除要重用的元素,如果要渲染长视图子列表 – 如果它只是几个视图则无关紧要。

其他可能性是你设置了events对象错误 – 很难从提供的代码量中分辨出来,但我打赌第一个。

一个非常普遍的挑战。 对于这个问题的未来发现者,这里有一篇关于视图渲染的精彩文章:

您只需要确保调用delegateEvents以随时重新绑定子视图上的事件.html()运行。 由于Backbone的setElement已经调用了delegateEvents,因此快速解决方案看起来像这样……

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