javascript - 移动端web如何禁止长按弹出的菜单?
伊谢尔伦
伊谢尔伦 2017-04-11 10:09:39
0
4
906

1、移动端按钮的:active伪类是无效的,必须加上

document.body.addEventListener('touchstart', function () { }); 

来激活按钮的:active。
2、长按press事件会导致浏览器弹出菜单,苹果的可以用-webkit-touch-callout: none;来禁止,但是安卓的不行。禁止弹出只能用js来控制:

window.ontouchstart = function(e) { 
    e.preventDefault(); 
};

好了,完美冲突- -。
两段代码正好效果相反。
请问有什么办法既能保证按钮的:active,又能禁止安卓浏览器长按弹出菜单?

ps:是微信内置浏览器,不用考虑其他浏览器。

伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

Antworte allen(4)
左手右手慢动作

题主最后如何完美的解决完美的冲突的呢?经尝试移动端用h5的新增事件 contextmenu 可以实现例如:

$('button').bind('contextmenu', function(e) {
  e.preventDefault();
})
黄舟

没有试过,你看看

http://stackoverflow.com/questions/12304012/preventing-default-context-menu-on-longpress-longclick-in-mobile-safari-ipad

Peter_Zhu

这个禁止在某些设备,某些浏览器是可行的。
但是对于国产的(比如QQ浏览器)阻止不了。

不过观察到一个现象的,就是在某些html标签的情况下,长按会出现右键菜单,

伊谢尔伦

如下代码:

node.ontouchend = function () {
    throw new Error("NO ERRPR:禁止长按弹出的菜单");
}
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage