移动端禁用系统默认菜单，还可以这么搞？

今天来给大家分享一下移动端如何禁用系统默认菜单，首先介绍下两个移动端私有属性
-webkit-touch-callout和-webkit-tap-highlight-color
-webkit-touch-callout：当你触摸并按住触摸目标时候，禁止或显示系统默认菜单。在iOS上，当你触摸并按住触摸的目标，比如一个链接，Safari浏览器将显示链接有关的系统默认菜单。这个属性可以让你禁用系统默认菜单。
-webkit-tap-highlight-color ：当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时，覆盖显示的高亮颜色。
该属性可以只设置透明度。如果未设置透明度，iOS Safari使用默认的透明度。当透明度设为0，则会禁用此属性；当透明度设为1，元素在点击时不可见。
在手机webkit浏览器中，用户在某一些按钮上长按3秒钟后，会弹出一个系统的列表，ios和android各自展现不一样，列表可以有复制或在在新窗口打开的等操作，这种体验对于按钮来说是不需要的，按钮上是绑定事件，有特殊功能，而这里系统把它当做一个链接的意义。查看了代码，原来是一个a标签，链接地址为空。
查看我的兴趣爱好
在IOS平台下只需控制当前元素的-webkit-touch-callout的样式属性为none;属性来禁止触发系统的菜单
a{-webkit-touch-callout:none}
这里补充-webkit-touch-callout:none 的功能，测试结果如下：
1.ios 长按时不触发系统菜单
2.ios 和 android 长按时不触发下载图片菜单
**安卓下，只能用button ，input type=”button” 代替a标签。
看到这里是不是发现，如此轻松就可以实现禁用默认菜单效果啦，小编会不定时更新前端相关的知识，有兴趣的话欢迎大家加群142991222一起讨论交流学习。