我怎样才能停止与Backbone.js的事件传播？

使用Backbone.js视图，说我想包括以下事件：

events: { 'click a': 'link', 'click': 'openPanel' } 

点击链接时，如何避免openPanel被触发。 我想要的是有一个可点击的框，将触发一个动作，但是这个框可以有触发其他动作的元素，而不是父动作。 以Twitter.com为例，并在Tweets /右侧面板中链接。

Answer 1

我一直在使用e.stopImmediatePropagation(); 以防止事件传播。 我希望有一个更简单的方法来做到这一点。 我想返回false; 但这是由于我熟悉jQuery

Answer 2

JQuery的preventDefault方法也是一个不错的select。

  window.LocationViewLI = Backbone.View.extend({ tagName: "li", template: _.template('<a href="/locations/<%= id %>"><%= name %></a>'), events: { "click a": "handleClick" }, handleClick: function(event) { event.preventDefault(); console.log("LocationViewLI handleClick", this.model.escape("name") ); // debugger; }, ... 

Answer 3

每个事件处理程序在触发时都会传递一个事件对象。 在你的处理程序中，你需要利用jQuery的event.stopPropagation（）方法。 例如：

 link: function(event) { //do some stuff here event.stopPropagation(); } 

Answer 4

其他两种方法可能适用于您：

1

 events: { 'click a': 'link', 'click *:not(a, a *)': 'openPanel' } 

然后，openPanel将不会捕获<a>任何<a>或子级上的click事件（如果您在<a>标记中有图标）。

2

在openPanel方法的顶部，确保事件目标不是<a> ：

 openPanel: function(event) { // Don't open the panel if the event target (the element that was // clicked) is an <a> or any element within an <a> if (event && event.target && $(event.target).is('a, a *')) return; // otherwise it's safe to open the panel as usual } 

请注意，这两种方法仍允许openPanel调用openPanel函数（例如，从父视图或此视图上的另一个函数）。 只是不要传递event参数，它会没事的。 您也不必在linkfunction中做任何特殊的事情 – 只需处理点击事件并继续前进。 虽然你可能仍然要调用event.preventDefault() 。

Answer 5

在“链接”function中返回“false”。