灰烬：如何在不是目标的视图中获取鼠标事件

Question

我有一个Ember.js应用程序，该应用程序的视图使用鼠标事件（向下，向上和向下）来允许用户通过在按住时单击和拖动来调整元素的大小。 就像超级按钮一样工作-直到鼠标指针离开视图的边界为止。 然后我没有任何迹象表明鼠标在做什么。

要了解我要实现的功能，请想到“画图”中的编辑视图-单击并拖动以创建一个矩形。 如果您通过视图的顶部，则矩形的高度会停止变化，但宽度会根据鼠标当前位置而变化。

我想继续获取鼠标移动的更新，即使目标现在是另一个视图。 如何以一种干净的方式实现它-而不修改其余视图？

理想情况下，我想做的是在mouseLeave中运行一个代码，该代码修改Ember的全局事件侦听器委派事件的方式-以便即使它们不是目标，也将它们传递给我的视图。 当然-释放鼠标按钮时，需要清除此设置。

Answer 1

然后，通常必须改为在document上注册事件处理程序，然后过滤出target以匹配您的视图。

使用jQuery的示例：

var mouseDown = false;
$(document).on("mousedown", function(e){
    // If we target the view element, we can start capture events
    var $target = $(e.target);
    if ($target.closest("#yourViewElement").length !== 0 || $target.is("#yourViewElement")) {
        mouseDown = true;
    }
});
$(document).on("mouseup", function(e){
    mouseDown = false;
});
$(document).on("mousemove", function(e){
    // We initially clicked on the view, so we listen for the changes now
    if (mouseDown) {
        // Parse events here, e.pageX / e.pageY etc.
    }
});