我有一个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.当我把它重写为全局状态对象时,问题就消失了。
3 回答

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

凤凰求蛊
TA贡献1825条经验 获得超4个赞
我认为问题在于动画调用中闭包中的局部变量。var 占位符Node, var 占位符家长和 var 占位符家长L.当我将其重写为全局状态对象时,问题似乎不太明显。但我不确定这是否是问题的根源。

偶然的你
TA贡献1841条经验 获得超3个赞
使其与承诺或异步/等待的使用同步。下面的链接包含有关异步的文档。https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function
添加回答
举报
0/150
提交
取消