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

最近在做移动端的需求时,有一个长按的需求,总是会触发移动端浏览器自带的长按效果,而且文字也会被选中,所以需要修改为文字不能被选中,浏览器默认长按效果禁止掉。

*{
	-webkit-touch-callout:none;/*系统默认菜单被禁用*/
	-webkit-user-select:none;/*webkit浏览器*/
	-khtml-user-select:none;/*早起浏览器*/
	-moz-user-select:none;/*火狐浏览器*/
	-ms-user-select:none;/*IE浏览器*/
	user-select:none;/*用户是否能够选中文本*/
 }
作者:天涯的海风
链接:https://www.jianshu.com/p/dd7d77c9a921(就是顶部链接)
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

  以上是禁止选中文本,增加上述css后会出现一下问题:
1.据说ios的input框会无法聚焦(没有试验过),解决如下:

input {
    -webkit-user-select: auto;
}

2.据说安卓的微信浏览器不起作用(安卓的微信浏览器起不起作用我不清楚,但是安卓华为的自带浏览器确定是不起作用的),解决如下:

document.oncontextmenu=function(e){

    e.preventDefault();

};

将系统的默认长按菜单事件禁止掉

posted @ 2021-02-09 09:05  小亮-  阅读(1442)  评论(0编辑  收藏  举报