Javascript 如何使用主干视图检测窗口事件？

这是我的冷杉。我只是想检测窗口上的keyup和keydown事件。当我使用addEventListener时，这是有效的，但我正在转向jQuery/主干框架

这里是有问题的模块。我已经确认事件回调没有触发

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)
}

请注意

\uuu.bindAll

。这是可选的，但这意味着在这些事件回调中，此引用的视图通常比jQuery提供的上下文更有用

---

另外，记住在视图被破坏时删除事件以防止内存泄漏。

奇怪的是，API中没有说明这一点-是的，如果您查看

delegateEvents

方法，它调用jQuery的

。on

on

this.$el

。我已经写了一段时间的大型主干应用程序，你很少需要听像window这样的东西，所以这很少是一个问题，通常为你规定了一个更好的架构（虽然你似乎有一个有效的案例）。好吧，如果你需要一些简单的东西来处理事件，你几乎使用一个视图模块，此外，我还认为我只需执行

el:window

，而不使用选择器，因为它将默认使用此选项。保持代码简洁。谢谢NPPS好主意在你的情况下，看起来你没有使用这个渲染。$el，这样可以很好地工作。