解决移动端页面滚动后不触发touchend事件
2016-03-11 16:17
513 查看
在移动端页面进行优化时,一般使用touch事件替代鼠标相关事件,用的较多的是使用touchend事件替代PC端的click和mouseup事件。
但是,touchend事件在页面滚动时有个问题。在滚动完成后,如果当前触点的位置所指的元素绑定了touchend事件,这时便会触发该元素的touchend事件,造成误操作。
解决方法是在滚动时就给停止touchend事件冒泡,实现如下:
stopTouchendPropagationAfterScroll(); function stopTouchendPropagationAfterScroll(){ var flag = false; window.addEventListener('touchmove', function(ev){ flag || (flag = true, window.addEventListener('touchend', stopTouchendPropagation, true)); }, false); function stopTouchendPropagation(ev){ ev.stopPropagation(); setTimeout(function(){ window.removeEventListener('touchend', stopTouchendPropagation, true); flag = false; }, 50); } }
相关文章推荐
- sencha touch打包问题(IOS7.x +iphone4 真机安装失败)
- cocos2d-x手游性能优化总结
- TexturePacker打包后的文件在cocos2d-x加载和使用
- 8.1.1 Android中的13种Drawable小结 Part 1
- iOS 保持界面流畅的技巧
- 笔记:Android源码和NDK目录及头文件
- ListView点击Item更换显示内容图片
- iOS pushmebaby 常见错误解析
- Android硬件加速
- Android 获取本地图片
- 论Android Studio 中 mipmaps 与 drawable 的区别?
- android屏幕的适配方法
- android listview 在添加header时候 OnItemClickListener position 索引不正确
- iOS-NSString
- Android布局优化之ViewStub、include、merge使用与源码分析
- unity截取图片并合成
- Android DatagramSocket error message: EADDRINUSE (Address already in use)
- Android ps命令执行后的各项参数含义
- Android 插件化开发
- 羊皮书APP(Android版)开发系列(五)APP引导页实现