解决令人烦恼的移动端浏览器默认事件

最新推荐文章于 2022-08-20 10:53:37 发布

小疯癫丶先森

最新推荐文章于 2022-08-20 10:53:37 发布

阅读量1.3k

点赞数

分类专栏：解决问题 javascript

本文链接：https://blog.csdn.net/qq_15010999/article/details/82757903

版权

javascript 同时被 2 个专栏收录

11 篇文章 0 订阅

订阅专栏

解决问题

2 篇文章 0 订阅

订阅专栏

干掉safari的橡皮筋

做过固定导航在safari下面调试的都知道！滚动会有上下回弹。体验很差。

document.body.addEventListener('touchmove', function (e) {
  e.preventDefault();
}, {passive: false});

上面不是最佳的解决方案，虽然可以通过e.target来过滤掉不需要阻止的地方。
接下来看看一些其他的插件吧
1.ScrollFix
2.preventoverscroll
听说是很好的解决方案，虽然楼主没有测试过，但是大家可以去试试。

挖坑待填中…

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

小疯癫丶先森

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

移动端项目（vue2+vant组件库）

qq_45585640的博客

06-23

6811

在命令行中输入以下命令创建 Vue 项目：这里建议两个都选上，更严谨。这里建议选择第 1 个，保存到单独的配置文件，这样方便我们做自定义配置。安装结束，命令提示你项目创建成功，按照命令行的提示在终端中分别输入： [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UynFzUoP-1654274042910)(assets/1582010300149-9932febe-2625-4ee7-986f-9190ab449fec.png)]如

Vue项目实战-vue2(移动端)

m0_57860459的博客

03-07

9119

1 条评论您还未登录，请先登录后发表或查看评论

取消事件默认行为（移动端）

weixin_30685047的博客

05-11

154

在编写功能时，遇到一个很有意思的事情，后来经过思索就解决了这个问题。这个功能的需求是点击一个按钮，弹出对话框，其他部分笼罩一层灰色，点击灰色后弹出框消失，如果只是这样就比较好实现，但还有其他需求，那就是这个按钮所在的这个整体内容，点击它之后会进入另一个页面，所以我的思路是使用事件冒泡，判断是点击了按钮还是内容的其他部分来决定是弹出对话框还是进入另一个页面，在点击弹出...

移动端页面滑动，取消滑动默认事件

weixin_30646315的博客

09-09

789

1.js方法 $('body').on('touchmove',function(event){ event.preventDefault && event.preventDefault(); event.returnValue=false; event.stopPropagation && event.s...

移动端禁止默认行为

m0_60703077的博客

03-08

489

全面禁止默认行为在移动端上，文字默认会被选中，会使用浏览器默认的滚动条，有默认的右键菜单。那么怎么才能禁止呢? 禁止方式 document.addEventListener('touchstart', function (ev ) { ev = ev || event; ev.preventDefault(); }) 这样子就可以了，那么怎么才能知道是否可以阻止默认事件？ ev.cancelable; 那么我们阻止了默认行为，怎么才能单独的使用？如果我们不想在 document

移动浏览器点击事件的问题

White feathe 的博客

03-01

645

大家都知道移动端的程序中，是没有点击事件的，只有 touchstart、touchmove、touchend。利用jquery这样写的话，也可以，但是当你点击按钮的单击事件时，将会等待大约300ms的时间。这是因为，浏览器是等着看，如果你是真正执行双击。如下代码所示,就会延时300ms： $("#sid").click(function(){ console.log(111); }); p

JS取消事件默认行为和移动端触屏事件

heartToSky的博客

02-18

1307

在写一些特殊的页面时候可能会需要取消事件的默认行为，例如取消鼠标滚轮的默认滚动 window.addEventListener('mousewheel',function(e){ console.log('滚动了'); e.preventDefault() }, { passive: false }) //火狐用DOMMouseScroll绑定滚轮事件 window.addEventListener('DOMMouseScroll', function

移动端适配

weixin_57259948的博客

10-24

1453

引言 移动端适配一向是很令人头大的问题，因为随着移动设备型号数量的爆发式增长，手机屏幕尺寸越来越多样化，网页内容自适应屏幕尺寸进行显示的需求也就越来越强烈。原本可能通过百分比/媒体查询等简单手段就可以常见的适配问题，但是对于页面有复杂结构或者视觉上有特殊要求的，就需要通过其他手段来解决了。像素基础像素像素是一个老生常谈的问题了。不论是做前端开发还是做UI设计，都离不开这个话题。其实真要深究起来，像素是一个十分复杂的概念。追溯到上世纪6、70年代，计算机的输出设备还是点阵式打印机，如何使打印机打

Vue移动端项目（一）

qq_48687155的博客

08-20

3241

Vue移动端项目

vue项目实战(移动端)

m0_65769258的博客

04-16

6527

移动端google浏览器默认事件

追梦先生-权

05-07

406

从 chrome56 开始，在 window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数，会默认为是 passive: true。浏览器忽略 preventDefault()举例： wnidow.addEventListener(‘touchmove’, func) 效果和下面一句一样 wnidow.addEventListener(‘t

阻止浏览器默认行为事件

钱辉

12-15

2734

有时候我们在页面中需要阻止浏览器的默认行为事件,下面是一些简单的示例: created() { this.stopF5Refresh(); }, methods: { stopF5Refresh() { document.onkeydown = function (e) { var evt = window.event || e; var code = evt.keyCode || evt.which; //屏蔽F1.

【前端】禁用移动浏览器长按默认事件

weixin_38792911的博客

09-17

4035

转载：H5移动端禁止长按弹出系统菜单"选择复制",“在浏览器打开” 移动端长按事件自定义的时候会和各种浏览器自带的长按默认事件冲突，所以禁止掉浏览器自带的长按事件 *{ -webkit-touch-callout:none;/*系统默认菜单被禁用*/ -webkit-user-select:none;/*webkit浏览器*/ -khtml-user-select:none;/*早起浏览器*/ -moz-user-select:none;/*火狐浏览器*/ -ms-user-select:none

阻止移动端H5开发浏览器默认左右滑动行为