var Base = Backbone.View.extend({
initialize: function () {
this._hello = "hello world!!";
console.log('Base::initialize');
},
events: {
'click .j-inherit-click': 'inheritClick',
'click .j-inherit-click2': 'inheritClick2'
},
inheritClick: function (event) {
event.preventDefault();
console.log('Base::inheritClick');
},
inheritClick2: function (event) {
event.preventDefault();
console.log('Base::inheritClick');
},
template: $('#sidebar').html(),
render: function () {
this.$el.html(this.template);
return this;
},
promptColor: function () {
var cssColor = prompt("Please enter a css color");
this.set({color: cssColor});
}
});
var Sidebar = Base.extend({
initialize: function () {
// Base.prototype.initialize.apply(this, arguments);
this.constructor.__super__.initialize.apply(this, arguments);
console.log('Sidebar::initialize');
// 继承方式1
// var obj = {
// 'click .j-inherit-click': 'inheritClick'
// };
// this.events = $.extend({}, Base.prototype.events, obj);
},
// events: {
// 'click .j-inherit-click': 'inheritClick'
// },
// 继承方式2
// events: function () {
// var obj = {
// 'click .j-inherit-click': 'inheritClick'
// };
// var obj2 = $.extend({}, Base.prototype.events, obj);
// return obj2;
// },
// 继承方式3 推荐这种
events: function () {
var obj = {
'click .j-inherit-click': 'inheritClick'
};
var obj2 = $.extend({}, this.constructor.__super__.events, obj);
return obj2;
},
inheritClick: function (event) {
event.preventDefault();
console.log('Sidebar::inheritClick');
},
inheritClick2: function (event) {
event.preventDefault();
console.log('Sidebar::inheritClick2 override Base::inheritClick2');
},
template: $('#sidebar2').html(),
render: function () {
this.$el.html(this.template);
return this;
}
});