好吧，所以我现在对Backbone.js很陌生，我遇到了许多其他人的问题，但我可以让建议的解决方案起作用。
长话短说我有一个ul视图，当li s集合发生变化时，它会将ul内部的Soccer.Teams.Li作为子视图进行管理。第一个渲染工作正常，add点击事件将触发。如果集合中发生change或li事件，则“已重新呈现的”Backbone.View.prototype.close = function () {
console.log('closing time!');
this.undelegateEvents();
this.remove();
this.unbind();
if (this.onClose) {
this.onClose();
}
};
Soccer.Teams.ListView = Backbone.View.extend({
tagName: 'ul',
className: 'ui-listview',
lis: [],
initialize: function(teams){
this.teams = teams;
this.teams.on('add change', this.render, this);
},
render: function(){
while(this.lis.length>0){
this.lis[0].close();
this.lis.shift();
}
this.$el.empty();
this.$el.attr('data-role','listview').css('margin','0px').css('width','220px').attr('id','teams-list');
this.teams.forEach(function(team){
this.lis.push(new Soccer.Teams.Li(team));
this.$el.append(this.lis[this.lis.length-1].render().$el);
}, this);
$("#teams-list-container").html('').append(this.el);
this.$el.listview();
this.delegateEvents();
return this;
}
});
Soccer.Teams.Li = Backbone.View.extend({
template: compileTemplate('team-li'),
tagName: 'li',
initialize: function(team){
this.team = team;
},
events: {
'click a': 'open'
},
open: function(event){
console.log('here');
event.preventDefault();
this.$el.parents('ul').find('.ui-btn-active').removeClass('ui-btn-active');
this.$el.addClass('ui-btn-active');
var teamView = new Soccer.TeamView(this.team);
teamView.render();
},
render: function(){
this.$el.empty();
this.$el.append(this.template(this.team));
this.delegateEvents();
return this;
}
});
子视图不再绑定点击事件。
以下是相关代码：
unbinding正如您所见，我undelegating和redelegating以及{{1}}。看到有什么问题吗？