如果 iframe 中发生 mousedown，文档将不会触发 mousemove 事件

Question

我有一个同源的 iframe。iframe 中的鼠标事件在文档中触发，如下所示：

// this won't work
$('iframe').contents().find('body').on('mousedown mouseup mousemove', function(e) {
  $(document).trigger(e);
});

// this does work
$('iframe').contents().on('mousedown mouseup mousemove', function(e) {
  $(document).trigger(e);
});

我的问题是如果在 iframe 中发生 mousedown 并且鼠标离开 iframe，则在发生 mouseup 之前，文档不会触发它自己的 mousemove 事件。

一旦鼠标离开 iframe，我已经尝试在 iframe 和文档中触发 mouseup，但文档 mousemove 事件在发生物理 mouseup 之前不会恢复。

Answer 1

使用对象文字表示法，您可以向 .on() 添加多个事件。然后我添加了 .contents() 以使所有事件在 Iframe 中工作。这是一个工作小提琴

$('.myiframe').contents().on({
    mousedown: function () {
        console.log('mouse down triggered');
    },
    mouseup: function () {
        console.log('mouse up triggered');
    },
    mousemove: function() {
        console.log('mouse move triggered');
    }
});