脚本慕斯事件触发很晚

Question

我有一个jquery排序插件，它工作得很好，但是如果我做一些拖动操作，mouseup事件开始变得非常慢。触发事件时大约需要 1 秒钟。如果我转储鼠标移动事件的结束，它会立即停止，但鼠标启动事件在第二个之后开始。我为代码中的每个方法添加了控制台.log（），但在拖动停止和鼠标上移动之间没有调用。可能是什么问题？如何在浏览器中调试可能的并行进程？代码如下所示：

    ....

        state.doc

            .on( 'mousemove', dragging )

            .on( 'mouseup', endDrag );

    }

    /**

     * @desc Start dragging

     * @param e event obj.

     */

    function dragging( e )

    {

        ...

        console.log('dragging end');

    }

    function endDrag( e )

    {

        var cEl = state.cEl,

            hintNode = $( '#sortableListsHint', state.rootEl.el ),

            hintStyle = hint[0].style,

            targetEl = null, // hintNode/placeholderNode

            isHintTarget = false, // if cEl will be placed to the hintNode

            hintWrapperNode = $( '#sortableListsHintWrapper' );

        if ( hintStyle.display == 'block' && hintNode.length && state.isAllowed )

        {

            targetEl = hintNode;

            isHintTarget = true;

        }

        else

        {

            targetEl = state.placeholderNode;

            isHintTarget = false;

        }

        offset = targetEl.offset();

        cEl.el.animate( { left: offset.left - state.cEl.mL, top: offset.top - state.cEl.mT }, 250,

            function()  // complete callback

            {

                tidyCurrEl( cEl );

                targetEl.after( cEl.el[0] );

                targetEl[0].style.display = 'none';

                hintStyle.display = 'none';

                // This has to be document node, not hint as a part of documentFragment.

  

在这里 https://camo.publicvm.com/ 我为代码中的所有方法制作了一个转储的示例。看看结束延迟的德拉姆格日志。另外，我在Opera浏览器中检查了这个问题，它没有问题。

编辑：我认为问题在于动画调用中闭包中的局部变量。var 占位符Node， var 占位符家长和 var 占位符家长L.当我把它重写为全局状态对象时，问题就消失了。

Answer 1

经典用户单击触发器和 。两者之间的时间通常约为50ms。在这么短的时间内，浏览器可能会由于鼠标按下和事件冒泡和传播触发的进程而繁忙，特别是如果您在DOM树中绑定了太多的处理程序，例如或。避免这种情况。mousedownmouseupdocument"html, body"此外，可能最终从未注册过。如果某些进程花费了太多时间，或者您使用鼠标的速度太快，则在触发目标元素时可能不会超过目标元素，因此永远不会触发该事件。mouseupmouseup

Answer 2

我认为问题在于动画调用中闭包中的局部变量。var 占位符Node， var 占位符家长和 var 占位符家长L.当我将其重写为全局状态对象时，问题似乎不太明显。但我不确定这是否是问题的根源。

Answer 3

使其与承诺或异步/等待的使用同步。下面的链接包含有关异步的文档。https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function