Question

我有一个视图，可以在列表中为每个项目创建一个子视图。通常我们称它们为ListView和ListItemView。我在ListItemView上附加了如下事件：

events: {
    "click .remove": "removeItem"
}

我为ListItemView创建了模板生成的html，大致类似于以下内容（用于{/}的交换lb / rb，所以你可以看到“非法”的html）：

{div class="entry" data-id="this_list_item_id"}

    SOME STUFF HERE

    {div class="meta"}

        {a class="remove" href="javascript:;"}[x]{/a}

    {/div}

{/div}

问题是，当点击任何[x]时，所有ListItemViews都会触发它们的removeItem函数。如果我让它脱离这个模型的ID，那么我将删除页面上的所有项目。如果我让它离开被点击的项目的父母的父元素来获取数据ID，我得到一个删除EACH ListItemView实例。有没有办法创建一个只触发单个removeItem的特定于实例的事件？

如果我让ListView持有ListItemView的单个实例并重新分配ListItem模型并为列表中的每个项目呈现它的工作原理。我最终只有一个动作（removeItem）被触发。问题是，我必须找到点击目标的父母的父母，以找到data-id attr。就个人而言，我认为下面的片段相当丑陋，想要更好的方法。

var that = $($(el.target).parent()).parent();

任何人给予的任何帮助都将不胜感激。

Answer 1

好像你的events哈希在你的ListView上。

如果是，那么您可以将events哈希移动到ListItemView，您的removeItem功能可以是以下

removeItem: function() {
  this.model.collection.remove(this.model);
}

如果不是这种情况，您可以提供ListView和ListItemView代码，以便我可以查看它。

Answer 2

疯狂的猜测，但可能;检查你的渲染的html是否有效。由于格式错误的html

，dom可能会进入tiz

每个实例事件绑定的骨干

2 个答案: