javascript - 在手机上长按网页中的按钮，浏览器会弹出这个按钮的背景图的操作菜单，怎样避免这种情况?

Question

网页是用jQuery Mobile做的，按钮是一个a标签，a标签里面嵌套了一个img标签。监听的是taphold事件。

Answer 1

要兼容的吧

cssa, img {
    -webkit-touch-callout: none;
    -ms-touch-callout: none;
    -moz-touch-callout: none;
    -o-touch-callout: none;
    touch-callout: none;
}

实在不行用js去实现

jsdocument.body.oncontextmenu=document.body.ondragstart= document.body.onselectstart=document.body.onbeforecopy=function(){
    return false;
};
document.body.onselect=document.body.oncopy=document.body.onmouseup=function(){
    document.selection.empty();
}; 

jq 写法？好像jq没有添加这个contextmenu方法你去看jq 2.0有没有，不过JSLite有哦

js$('#box').on('contextmenu',function(e){
    replyRightMenu(e);
    if ( e && e.preventDefault ) e.preventDefault(); 
    else window.event.returnValue = false;
    e.cancelBubble = true;
    return false;
});

Answer 2

a, img {
    -webkit-touch-callout: none;
}

Answer 3

你想要 a 的什麼效果，touch highlight？

img 不是用來做 ui 的，img 是網頁信息的一部分。ui 請用 css 設置 background

只要用 css 做就不會有這個問題了。

Answer 4

/css/
body{-webkit-tap-highlight-color: rgba(0,0,0,0);}

Answer 5

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