Backbone click事件触发所有集合而不是模型的事件

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在LogView中引起的:el:$('.accordion')

Backbone的视图事件是视图的范围el.在这种情况下,您已将视图指定el为具有"accordion"类的所有 HTML元素.因此,当您使用此类单击任何 HTML元素时,代码将针对所有这些运行,这就是您看到此行为的原因.

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

• Backbone.js:获取Clicked元素的模型

我还建议阅读这篇文章,以便更好地理解elBackbone 的使用,以及它的一些技巧和陷阱:

• Backbone.js:对象文字,视图事件,jQuery和 el