如何使用Backbone-Views检测窗口事件?

oknrviil  于 2022-11-10  发布在  其他
关注(0)|答案(1)|浏览(184)

这是我的第一次尝试。我只是试图检测窗口上的keyup和keydown事件。这在我使用addEventListener时是有效的,但我将转向jQuery/Backbone框架。
这里是有问题的模块。我已经验证了事件回调没有触发。

var UserTryView = Backbone.View.extend({
    Name: 'UserTry',
    keys: {},
    events: {
        "keyup window"                   : "keyup",
        "keydown window"                 : "keydown"
    },
    keydown: function (e) {
        console.log('keydown detected');
        var self = this;
        this.keys[e.keyCode] = null;
        $A.testKeys(this.keys, '1684', function () {
            self.render();
        });
    },
    keyup: function (e) {
        delete this.keys[e.keyCode];
    },
    render: function () {
        new FavoritesView({el: $A.el('#mm')});
        new FeedView({el: $A.el('#at_view')});
        new AccountView();
        // Storage.setObj(packet.server.smalls);
        Page.flip('main');
    }
});
var user_try_view = new UserTryView();
pod7payv

pod7payv1#

事件散列只会查看元素本身或子元素。这与视图的体系结构是一致的--你通常会避免查看视图树(如果你使用子视图的概念,我希望你是/会)。
要侦听窗口事件,您应该以正常的jQuery方式将其挂钩,即:

initialize: function() {
    _.bindAll(this, 'onWindowKeyUp', 'onWindowKeyDown');
    $(window).on({
        'keyup': this.onWindowKeyUp,
        'keydown': this.onWindowKeyDown
    });
},

onWindowKeyUp: function(ev) {
    console.log('Key up:', ev)
},

onWindowKeyDown: function(ev) {
    console.log('Key down:', ev)
}

注意_.bindAll,这是可选的,但它意味着在这些事件回调中,this引用的视图通常比jQuery提供的上下文更有用。
P.S.当您的视图被破坏时,请记住删除该事件,以防止内存泄漏。

相关问题