events - Backbone 点击事件为所有集合而不是模型触发事件

Question

无法弄清楚出了什么问题。当我单击模型标题时，它会立即获取集合中的所有模型，而不是获取一个模型。如果我将此事件从 logView 移动到 logsView 它可以正常工作但无法访问模型，那么我可以使用索引或 Ant 其他模型的 ID 找到此模型，但不认为这是一个好方法。

var Log = Backbone.Model.extend({});


window.LogsList = Backbone.Collection.extend({
    model:Log,

    url:function (tag) {
        this.url = '/logs/' + tag;
        return this;
    }
});

window.colList = new LogsList();

window.logView = Backbone.View.extend({
    el:$('.accordion'),

    template:_.template($('#log').html()),

    initialize:function () {
        this.model.bind('add', this.render, this);
    },

    events:{
        "click .accordion-toggle" :"getLogBody"
    },

    render:function () {
        return this.template(this.model.toJSON());
    },

    getLogBody:function () {
        this.model.fetch();
    }
});

window.LogsView = Backbone.View.extend({
    el:$("#content"),

    initialize:function (options) {
        colList.bind('reset', this.addAll, this);
        colList.url(options.data).fetch();
    },

    addOne:function (model) {
        var view = new logView({model:model});
        $("#accordion").append(view.render());
    },

    addAll:function () {
        colList.each(this.addOne);
    }
});

window.listView = new LogsView({data:"Visa_Cl"});

Answer 1

问题是由您的 el 引起的在日志 View 中:el:$('.accordion')
Backbone 的 View 事件是 View el 的范围.在本例中，您已指定 View 的 el如 所有 具有“ Accordion ”类的 HTML 元素。因此，当您单击具有此类的任何 HTML 元素时，代码会为所有这些元素运行，这就是您看到此行为的原因。

本文将向您展示一些正确执行您想要的操作的选项:

Backbone.js: Getting The Model For A Clicked Element

我还建议您阅读这篇文章，以更好地了解 el 的使用在 Backbone 中，以及它的一些技巧和陷阱:

Backbone.js: Object Literals, Views Events, jQuery, and el