backbone.js - 如何使用 Marionette 创建全局按键事件监听器

Question

我正在开发一个应用程序，我希望它完全由键盘输入驱动，而不是任何鼠标点击。它是使用 Marionette 开发的，虽然我完全能够响应输入事件，但我真的很难响应不包含任何输入的 View 事件。

events: ->
    'keyup #discovery-region' : 'logKey'

logKey: (e) ->
    alert("Key pressed")
    console.log("Key pressed " + e.which)

在我的 index.html 文件中有

<div class="discovery" id="discovery-region"></div>

在这种情况下，我想控制发现区域上的键盘输入。但是，我也希望稍后删除该区域，并在其位置放置另一个区域。我是否应该创建某种全局机制来处理事件？

Answer 1

我设法通过创建一个布局 View 来存档它，在这个布局中我定义了一个区域，在这个区域内我可以显示我想要的任何 View 并在需要时交换它们，在布局 View 中我还定义了一个事件区域内 keyup 的监听器。它对我有用，唯一的技巧是焦点必须放在区域 div 上。但我认为您可以向其他地区添加更多听众...

var MyLayout = Backbone.Marionette.Layout.extend({
 template: "#layout-template",
 events : {
    "keyup #aRegion" : "test"
 },
 regions: {
   aRegion: "#aRegion"
 },
 test : function () {
  console.log("hi");
}                                             
});

这是工作的jsfiddle http://jsfiddle.net/rayweb_on/b7tbX/

希望对您有所帮助。