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

How can I detect window events using Backbone-Views?

本文关键字：事件 窗口 检测 何使用 Backbone-Views      更新时间：2023-09-26

这是我第一次尝试。我只是想检测窗口上的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();

事件散列将只查看元素本身或子元素。这与视图的架构是内联的——你通常避免查找你的视图树(如果你正在使用子视图的概念，我希望你是/将)。

要监听一个窗口事件，你应该用普通的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提供给你的上下文更有用。

注:请记住在视图被销毁时删除该事件，以防止内存泄漏。

相关文章：