移动端web如何禁止长按弹出的菜单？

Question

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

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

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

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

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

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

Answer 1

如果是禁用长按选择文字功能，用 css 就可以:

* {
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}

如果是想禁用长按弹出菜单, 用 js

  node.addEventListener('contextmenu', function(e){
    e.preventDefault();
  });

Answer 2

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

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

Answer 3

没有试过，你看看

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

Answer 4

原来是想查下 contextmenu 的兼容性如何
看到MDN已经建议不要再使用了，未来可能被废弃
建议各位不要误入歧途了

https://developer.mozilla.org...

Answer 5

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

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

Answer 6

如下代码：

node.ontouchend = function () {
    throw new Error("NO ERRPR:禁止长按弹出的菜单");
}

Answer 7

为什么安卓平板电脑的写这几个没有用，还是可以长按弹出菜单出来，是只能手机，平板不行吗？