主干网委派事件未冒泡/传播

Question

Backbone中事件传播的奇怪问题。大多数人问如何阻止事件传播，但我很难让我的事件传播！！

这里我有两个View对象。MainView包含Item视图并侦听点击事件以调用run（）：

var MainView = Backbone.View.extend({
    ...
    events: {
        "click .item": "run" // works only if no click event in Item
    },
    render: {
         // Item View object children
    },
    run: function() {
        //run :)
    }
});

项目视图对象也会监听自身的点击事件，以切换打开/关闭行为：

var Item = Backbone.View.extend({
    ...
    events: {
        "click" : "toggle" // MainView click event works when this is removed
    },
    toggle: function() {
        this.model.toggle();
    }
});

问题是单击Item时MainView.run（）没有被激发，而它有一个Item.thoggle（）.的单击事件

但是，如果我删除Item.thoggle（）click事件，MainView.run（）将触发。这让我得出结论，在我无法控制的情况下，这一事件在某种程度上被迫停止传播。

我该如何解决这个问题？我是错过了一些显而易见的东西，还是这是不可避免的？

感谢您的任何建议和回答：）。

Answer 1

项目视图中的单击事件似乎没有绑定到特定的DOM对象。侦听通用单击事件可能会覆盖侦听特定.item单击事件的Backbone。尝试将ID或类名添加到项目视图单击事件中，以消除任何歧义。

var Item = Backbone.View.extend({
  ...
  events: {
    "click .some-class" : "toggle" // This should fix your problem
  },
  ...   

Answer 2

Jay B.Martin回答了这个问题。

问题是View调用this.model.thoggle（）；

toggle（）函数设置MainView正在侦听的一些变量，从而引发render（）事件。

当MainView调用render（）时，Item视图依次被移除、渲染并添加到DOM中。这将使用事件丢失绑定到DOM元素的事件：｛｝。

相反，无论DOM中绑定到的元素的上下文/状态如何，都应该使用_.bind（）或_.bindAll（）来永久绑定事件。

---

原始评论答案：

@Dan0，对不起，我有点困惑，切换怎么会是你问题的根源。我认为这是绑定到嵌套视图中的隐式DOM元素所产生的上下文歧义的症状。调用toggle后，单击事件将丢失其最初绑定到的上下文（即this.el）。解决此问题的惯用方法是：a）传递一个显式元素，以便它可以在后续事件上重新绑定，或者b）使用_.bind或_.bindAll，以便单击事件在上下文更改时永久绑定到项视图。–周B.马丁8月10日23:46