一般,我们想要禁止橡皮筋效果的话,会给document加阻止默认行为,不过新版的谷歌浏览器不已经不让这么做了,所以现在一般都是在最外层的加个div,然后给它做阻止默认行为,但是阻止了默认行为会带来以下问题
阻止默认事件带来的问题:
1)解决IOS10+ safari 以及部分安卓浏览器 不在支持 viewport的最大缩放值和禁止缩放的问题
2)解决IOS10+ safari下给body加overflow:hidden无效的问题具体解释:给元素加了 一个绝对定位,但是元素本身没有定位父级,元素如果超出了body的宽度,body 上的overflow对这个元素,不起效果
解决办法:
给body加上一个相对定位
3)解决事件点透的问题
4)禁止mouse事件执行
5)阻止浏览器的回弹效果
6)阻止触发浏览器的滚动条
7)阻止触发系统菜单
8)阻止图片文字被选中
9)阻止input的输入
第9个问题就比较坑爹了,input不让输入了,怎么点击也没用;一般的做法是,点击input框,打开一个新的页面,这个新的页面不要阻止默认行为;
有人说给input加阻止冒泡,这样确实可以解决问题,这个时候,输入框可以输入了,但是你再input上滑动的时候,整个页面又可以滚动了【浏览器滚动】;(如果阻止了默认行为,那么滚动的时候,我们一般都是自己写一个滚动组件的,因为阻止了默认行为浏览器的滚动已经失效了)