Jquery backbone.js：如何停止嵌套视图之间的事件传播

我正在寻找使视图独立的方法。因此，视图的事件被约束到该视图，而不进入子视图或父视图的元素

js框架使用jQuery.on方法绑定视图顶部元素（view.el）上的事件。由于我有嵌套视图，当我单击视图B的按钮时，该事件也将在视图A上触发。我知道我可以向视图B的按钮单击添加一个处理程序并返回false，但这样我需要知道父视图的所有事件并始终处理所有这些事件

下面是问题的一个例子：

我想点击MyViewB按钮，不触发ViewA事件。 我尝试在视图B的事件中添加

'all'：->return false

，但没有成功

---

有什么建议吗？

您可以在嵌套视图（MyViewB）的单击处理程序中使用，以防止事件在DOM树中冒泡。

如果问题是视图B必须是可重用的，并且您不介意视图a知道这一点，那么您可以为视图a绑定使用更具体的事件选择器

在本例中，使用了一个简单的“按钮”选择器，它将从视图a及其子视图B中捕获两个按钮。如果使用了类，如“.btn”或“button.view-a”，则将防止出现问题

使用“.btn”绑定事件可以看到以下代码段

events:
    'click .btn': 'click'

click: (ev) ->
    alert('MyViewA button click')

initialize: ->
    $('<button class="btn">').text('MyViewA').appendTo(@el)
    child = new MyViewB
    $(child.el).appendTo(@el)

事件：
'click.btn'：'click'
点击：（ev）->
警报（'MyViewA按钮单击'）
初始化：->
$（''）.text（'MyViewA'）.appendTo（@el）
child=newmyviewb
$（child.el）.appendTo（@el）

我知道，但这并不能解决我的问题，因为我需要始终处理父视图的所有事件。由于我希望视图可以重用并且独立于其父视图，因此它不是一个解决方案。只需检查

evt.currentTarget===evt.target

，就足够了吗？如果为false，则表明事件是否作为传播的一部分触发，在本例中，您可以忽略该事件。这似乎是一种方法，但我必须在所有事件处理程序中执行此检查，这并不好。您几乎与DOM如何触发和传播事件有关。我不认为您能够像您描述的那样真正实现DOM事件的解耦。实际上，您可以为您关心的事件定义主干事件，并手动管理传播。因此，您可以在嵌套视图上侦听主干事件，而不是侦听父视图上的单击事件。是的，它会。我需要在类中始终使用前缀，如

view-a:button

。但当我有一个类a实例作为一个类a实例的子实例（或在一个类a实例的后代中）时，它就不起作用了。显然，事件对象可能是一个方法，这样它可能是动态的，因此有可能添加一个实例计数器，以确保事件只绑定到在该实例上创建的元素。这虽然不太简单，但对所描述的继承问题有效。在实践中：，请注意，我在视图构造函数外部创建了子元素，以避免无限循环。如果事件传播，这又有什么关系呢？没有好的方法可以捕获所有事件-您可以检查方法是否以这样的“on”开头，但仅此而已。如果你这样做，通常会被认为是糟糕的架构，所以我想知道为什么这只是一个例子。我希望有独立的观点，但它似乎并不简单。如果父视图有一个类为“submit”的按钮，我不在乎它的一个子视图是否已经有了它。但这似乎很重要，我想创建独立视图会变得更复杂。唯一正确隔离的是Web组件