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许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


名称栏目:JS中mouseup事件丢失的原因与解决办法-创新互联
网页路径:http://hbruida.cn/article/dceope.html