拖拽效果遇到的问题及解决方案

一、拖拽效果

拖拽效果问题:

1)如果拖拽速度过快,鼠标再次经过物体时,即使没有再次按下鼠标,依然可以执行移动效果
原因:由于鼠标移动速度较快,鼠标抬起事件没有在物体上触发,mousemove事件依然在物体上绑定着
2)现在浏览器中文字和图片默认是可以被拖拽的,会影响拖拽事件执行
解决:return false;
3)使用return false拦截默认行为,标准浏览器都可以,低版本浏览器不执行。
低版本IE中可以通过添加全局捕获来来捕获事件 setCapture() ,此方法只能被ie 识别

全局捕获:setCapture() 释放捕获: releaseCapture()
解释:通过setCapture方法给元素添加全局捕获,元素只要添加了全局捕获会一直监听对应的事件,只要发现有对应的事件触发,就会截获事件,由添加了全局捕获的元素去处理,全局捕获使用完了以后,通过releaseCapture释放捕获。

4)边界问题,在拖拽过程中,物体不可以超过边界
5)碰撞检测
思路:找出安全区域,反之就是碰撞区域
拖拽效果遇到的问题及解决方案