zoukankan      html  css  js  c++  java
  • backbone event inherit

    View Code
    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;
                    }
                });
  • 相关阅读:
    mysql那些事(1)手机号与座机号码如何存储
    分享一个PHP调用RestFul接口的函数
    php sprintf用法
    HTTP状态码详解
    PHP随机生成中国人姓名的类
    PHP计算两组经纬度坐标之间的距离
    PHP根据经纬度获取在范围坐标的数据
    PHP 利用QQ邮箱发送邮件「PHPMailer」
    PHP中利用PHPMailer配合QQ邮箱实现发邮件
    修改PHP上传文件大小限制
  • 原文地址:https://www.cnblogs.com/leamiko/p/2955506.html
Copyright © 2011-2022 走看看