JS中mouseup事件丢失的原因与解决办法-创新互联

前言

当实现类似Excel选中区域的功能时，经常出现 mouseup 事件丢失的情况，由于缺少了 mouseup 事件，导致一个完整的操作无法进行。

如果你是想进行拖拽移动操作，也可以参考本文。

原因

目前发现两个原因：

• 触发了浏览器的 drag 操作，导致mouseup丢失。
• 由于鼠标离开了操作的区域，触发了mouseleave导致mouseup丢失。
  

解决办法

第一种情况

通过执行下面的代码阻止系统默认的操作来防止触发 drag 操作：

//在事件中
e=e || window.event;
pauseEvent(e);

//阻止事件冒泡
//不仅仅要stopPropagation，还要preventDefault
function pauseEvent(e){
 if(e.stopPropagation) e.stopPropagation();
 if(e.preventDefault) e.preventDefault();
 e.cancelBubble=true;
 e.returnValue=false;
 return false;
}

另外有需要云服务器可以了解下创新互联建站www.cdcxhl.com，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。