javascript - 主干点击事件: Trigger only on element actually clicked on

Question

在 Backbone 应用程序中，我为集合中的每个模型实例化一个 View 。

如果单击这些 View 之一，我想调用一个函数。

不幸的是，该函数被调用n次，其中n是实例化的模型/ View 的数量。我已经设法通过找出点击了哪个元素来解决这个问题，但是当我知道一个事件可能在同一时刻被触发 200 多次时，我仍然感到不舒服。

事件绑定(bind)如下:

var Item = Backbone.View.extend({
    events: {
        'click .list-group-item': function(event) { this.doSomething(event); },
    },

    doSomething: function(event) {
        $(event.currentTarget).toggleClass('active');
    },
});

在上面的代码中，您还可以看到我使用 event.currentTarget 的解决方法，但如何避免这种情况呢？有没有一种方法可以区分 .list-group-item 元素，而无需借助 event.currentTarget，因此最好在单击元素时立即进行？

另一种方法是将事件绑定(bind)到父元素，因此它只触发一次，然后使用 event.currentTarget，但这对我来说也有点可疑。

Answer 1

由于您想要附加到 View 中任意位置的点击，因此无需指定 .list-group-item。另外，您只需要指定事件回调函数的名称:

var Item = Backbone.View.extend({
  events: {
    'click': 'doSomething'
  },

  doSomething: function(event) {
    $(event.currentTarget).toggleClass('active');
  },
});