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

我有一个视图，其中包含相同类型的嵌套视图。因此，我的delegateEvents选择器需要注意只选择顶层元素，而不是子视图中的元素。Backbone.js - 为什么我的delegateEvents选择器不工作？

下面的代码，我的视图的上下文中使用，成功选择我要结合元件：

var $link = this.$('> .node > .indent > a'); // success!

的delegateEvents对象，使用相同的选择，不挂钩事件在所有：

events: { 
    'click > .node > .indent > a': 'toggleGrouped' // fail :(
}

请注意，我已经证实，事件确实联播与其他更简单的选择工作，所以它不是与渲染的问题。

我在做什么错？

来源

2011-12-30 Nathan Ridley

我认为@darvelo在这里有最好的解决方案。只要确保所有的“低级别”选择器的事件监听器都调用了'event.stopPropagation（）;'。然后，这些事件永远不会冒泡到达您的顶级View的侦听器，并且您永远不必担心如何使您的选择器如此具体！ – Lambart 2015-09-07 22:50:56

@Lambart谢谢，虽然你会注意到我在4年前问过这个问题;） – 2015-09-07 22:58:03

我知道！但差不多四年后，我碰到了和你一样的问题。这仍然是一个有效的问题，并且仍然有有效的答案......其中之一是*只有*超过2岁！ :) – Lambart 2015-09-08 16:55:33

这可能与jQuery的delegate事件不顺心的> .node > .indent > a选择做。

您可以通过在视图的渲染方法中添加以下代码行来确认这一点。（这是骨干，是在delegateEvents做）

$(this.el).delegate('> .node > .indent > a', 'click', this.toggleGrouped);

如果仍然不行，则问题已与delegate事件，而不是骨干做。

解决方法是在render方法中完成所有呈现后，绑定到click事件。

this.$('> .node > .indent > a').click(this.toggleGrouped);

你也必须的toggleGrouped上下文绑定的初始化方法，因为它不再被自动绑定。

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

来源

2011-12-30 15:20:52 Paul

找到了答案。 delegateEvents使用jQuery.delegate()，由于某种原因不接受与儿童伸开始选择：

http://api.jquery.com/delegate/#comment-66006048

来源

2011-12-30 15:16:34

另一种方式来做到这一点，我认为可能是刚刚带着孩子选择>出events哈希，并在事件处理程序使用event.stopPropagation()像这样：

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

    // event handling code 
}

的第一个亲了连锁店倾听该事件会得到它，然后阻止它冒泡到任何其他可能也会发生事件的人。

来源

2013-05-17 01:53:50 darvelo

这里最好的答案;它允许事件配置（和清理）保持简单，使用正常的Backbone'events'散列。 – Lambart 2015-09-07 22:46:20

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

回答

相关问题