首页 > 代码库 > 通过阻止 touchstart 事件,解决移动端的 BUG
通过阻止 touchstart 事件,解决移动端的 BUG
在 iOS10 下,即使设置了 meta 标签的 user-scalable=no 依然不能阻止用户缩放。
解决此 BUG 的方法是阻止 PC 事件:
document.addEventListener(‘touchstart‘, function(ev) { ev.preventDefault(); });
另外,此方法还能解决 iOS10 中横向页面溢出,即使给 body 设置了 overflow:hidden 依然能横向滑动的问题。
不过添加了此事件后会阻止 iOS10 的橡皮筋效果,另外也会禁止文字选中功能。
通过阻止 touchstart 的默认事件来解决此 BUG,另外阻止此默认事件还可以解决 300ms 延迟的 BUG。
当然,由于阻止了默认行为,那么 a 标签链接的默认跳转页就无法实现了,只能通过手动添加事件:
aDom.addEventListener(‘touchstart‘, function(ev) { window.location.href = "www.tirion.me"; });
输入框获取焦点也需要手动解决:
inputDom.addEventListener(‘touchstart‘, function(ev) { ev.stopPropagation(); });
通过阻止 touchstart 事件,解决移动端的 BUG
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。