Sự kiện nhấp chuột tuyến tính kích hoạt sự kiện cho tất cả bộ sưu tập thay vì kiểu

Question

Không thể tìm ra điều gì sai. Khi tôi nhấp vào tiêu đề mô hình, nó sẽ tìm nạp tất cả các mô hình trong bộ sưu tập cùng một lúc thay vì tìm nạp một mô hình. Nếu tôi di chuyển sự kiện này từ logView sang logsView nó hoạt động đúng nhưng không có quyền truy cập vào mô hình, tôi có thể tìm mô hình này bằng cách sử dụng chỉ mục hoặc ant của mô hình khác nhưng không nghĩ đây là một cách hay.

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

Vấn đề là do el của bạn trong LogView: Sự kiện quan điểm el:$('.accordion')

Backbone của là phạm vi để quan điểm của el. Trong trường hợp này, bạn đã chỉ định el của chế độ xem là TẤT CẢ các phần tử HTML với một lớp "accordion". Do đó, khi bạn nhấp vào bất kỳ yếu tố HTML nào của bạn với lớp này, mã sẽ chạy cho tất cả chúng, đó là lý do tại sao bạn thấy hành vi này.

Bài viết này sẽ chỉ cho bạn một vài lựa chọn để làm những gì bạn muốn, một cách chính xác:

• Backbone.js: Getting The Model For A Clicked Element

Tôi cũng sẽ khuyên bạn nên đọc cái này, để hiểu rõ hơn về việc sử dụng các el trong Backbone và một vài thủ thuật và bẫy của nó:

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