javascript - meteor JS : How should I bind events to the window in Meteor?

Question

我正在尝试检测 Meteor 窗口外的鼠标弹起。我试过了，但是 window 似乎不起作用:

Template.layout.events({
  'mouseup window' : function(e) {
    console.log("mouseup");
  }
});

我应该如何将事件绑定(bind)到 Meteor 中的窗口？

Answer 1

下面的代码片段将在创建模板时绑定(bind)事件处理程序，并在销毁模板时解除绑定(bind)。应该给你你正在寻找的行为。

var layoutMouseUpHandler = function(e) {
    console.log('window.mouseup');
};

Template.layout.onCreated(function() {
    $(window).on('mouseup', layoutMouseUpHandler);
});

Template.layout.onDestroyed(function() {
    $(window).off('mouseup', layoutMouseUpHandler);
});

请注意，该事件绑定(bind)在 onCreated 处理程序中，因此当事件触发时模板可能尚未呈现。如果您的处理程序与 DOM 交互，您将需要检查它。它未绑定(bind)在 onRendered 处理程序中，因为如果重新呈现模板，这将导致您的 mouseup 处理程序被绑定(bind)多次。

编辑:正如 Serkan 在下面提到的，新的 UI 引擎仅在模板插入 DOM 时调用一次 onRendered。如果您的事件处理程序将与 DOM 交互，这使其成为比 onCreated 更好的选择。