Question

有没有办法暂停mousemove事件直到任务完成？

$( document ).bind( 'mousemove', function ( e )
{
    // mousemove: please wait and stop moving
    document.removeEventListener('mousemove');

    // I am the task
    $.ajax( {
        url: '/getData',
        type: 'POST',
        success: function ( result ){}
    } )
    .done(function()
    {
        // I am done, start moving...
        document.addEventListener('mousemove');
    });
} );

我想要的是什么：

mousemove事件被触发并停止为一旦它被解雇了。
内部的功能执行。
当功能完成执行时， mousemove事件再次开始触发
这样做会暂停鼠标移动事件直到任务完成或失败。

Answer 1

首先，为什么要将原始DOM /事件访问与jQuery混合使用？不要那样做。

要实现您想要的功能，只需将您的功能设为非匿名功能，并使用$(document).one('mousemove', yourFunction);绑定它 - 无论是在外部还是在done()函数中。

function handleMouseMove(e)
{
    // I am the task
    $.ajax({
        url: '/getData',
        type: 'POST',
        success: function ( result ){}
    })
    .done(function() {
        $(document).one('mousemove', handleMouseMove);
    });
}

$(document).one('mousemove', handleMouseMove);

Answer 2

如果您的任务时间很短。您可以使用bool标志来锁定mousemove功能。这将调用mousemove上的函数，但返回时不做任何事情直到你释放锁。

var moveFlag = true;

$( document ).bind( 'mousemove', function ( e )
{
    if(moveFlag == false)
         return;

    moveFlag = false;

    // I am the task
    $.ajax( {
        url: '/getData',
        type: 'POST',
        success: function ( result ){}
    } )
    .done(function()
    {
        // I am done, start moving...
        moveFlag = true;
    });
} );

Answer 3

使用标志来禁用/启用它：

$(document).data('enableMyMouseMove',true).bind('mousemove',function (e) {

    if($(document).data('enableMyMouseMove')) {
      $(document).data('enableMyMouseMove',false);
      $.ajax( {
        url: '/getData',
        type: 'POST',
        success: function (result) {},
        complete: function (){ $(document).data('enableMyMouseMove',true); }
      });
    }
});

请注意，我已经将'done'函数移动到ajax调用的complete eventHandler上，因为imo更干净，但如果你愿意，你可以保留done函数，逻辑是相同的。

尽量避免绑定/解除绑定事件处理程序，因为除非你知道自己在做什么，否则创建memleaks是一种非常简单的方法，尤其是在ie。

原因是ie对js和DOM对象有单独的垃圾收集，如果两者之间存在循环引用，则不会发生垃圾收集。绑定eventHandlers

时，很容易在js和DOM之间创建循环依赖关系

有没有办法暂停'mousemove'事件直到任务完成？

3 个答案: