Backbone.js-为什么我的delegateEvents选择器不工作?

Backbone.js-为什么我的delegateEvents选择器不工作?,backbone.js,Backbone.js,我有一个视图,其中包含相同类型的嵌套视图。因此,mydelegateEvents选择器需要小心,只选择顶级元素,而不选择子视图中的元素 在我的视图上下文中使用的以下代码成功地选择了我希望绑定的元素: var $link = this.$('> .node > .indent > a'); // success! 使用相同选择器的delegateEvents对象根本不会连接事件: events: { 'click > .node > .indent >

我有一个视图,其中包含相同类型的嵌套视图。因此,my
delegateEvents
选择器需要小心,只选择顶级元素,而不选择子视图中的元素

在我的视图上下文中使用的以下代码成功地选择了我希望绑定的元素:

var $link = this.$('> .node > .indent > a'); // success!
使用相同选择器的
delegateEvents
对象根本不会连接事件:

events: {
    'click > .node > .indent > a': 'toggleGrouped' // fail :(
}
请注意,我已经确认事件连接确实与其他更简单的选择器一起工作,因此它与呈现无关


我做错了什么?

找到了答案
delegateEvents
使用
jQuery.delegate()
,由于某些原因,它不接受以子后代开头的选择器:


这可能与jQuery的
委托
事件不喜欢
.node>.indent>选择器有关

您可以通过在视图的渲染方法中添加以下代码行来确认这一点。(这就是主干网在
delegateEvents
中所做的工作)

如果仍然不起作用,那么问题与
委托
事件有关,而不是主干

解决方法是在render方法中完成所有渲染后绑定到click事件

this.$('> .node > .indent > a').click(this.toggleGrouped);
您还必须在initialize方法中绑定
toggleGrouped
的上下文,因为它不再被自动绑定

initialize: function() {
  _.bindAll(this, 'toggleGrouped');
}

我认为另一种方法可能是将子选择器
事件
散列中取出,并在事件处理程序中使用
事件.stopPropagation()
,如下所示:

toggleGrouped: function (evt) {
  evt.stopPropagation();

  // event handling code
}

链上第一个侦听该事件的家长将获得该事件,然后防止它冒泡到任何其他可能也捕捉到该事件的人。

最佳答案在此;它允许事件配置(和清理)保持简单,使用普通主干
events
hash。只需确保所有“低级”选择器的事件侦听器调用
event.stopPropagation()。然后这些事件永远不会泡沫达到你的顶级视图的听众,你也不需要担心如何使你的选择如此具体@兰伯特:谢谢你,不过你会注意到我差不多4年前问过这个问题;)我知道!但碰巧我和你有同样的问题,差不多4年后。这仍然是一个有效的问题,仍然有有效的答案。。。其中一个才2岁多一点!:)
toggleGrouped: function (evt) {
  evt.stopPropagation();

  // event handling code
}