Roy*_*ron 53 javascript android mobile-webkit
我想禁用在我的Web应用程序中长时间点击(触摸并按住)图像后出现的上下文菜单.我看过不同想法的帖子怎么做,但它们似乎都不适合我.
有没有办法通过HTML/CSS/Javascript在Android上执行此操作?
bbs*_*nbb 149
上下文菜单有自己的事件.你只需要抓住它并阻止它传播.
window.oncontextmenu = function(event) {
event.preventDefault();
event.stopPropagation();
return false;
};
Run Code Online (Sandbox Code Playgroud)
Rom*_*rik 33
这应该适用于1.6或更高版本(如果我没记错的话).我不相信1.5或更早的解决方法.
<!DOCTYPE html>
<html>
<head>
<script>
function absorbEvent_(event) {
var e = event || window.event;
e.preventDefault && e.preventDefault();
e.stopPropagation && e.stopPropagation();
e.cancelBubble = true;
e.returnValue = false;
return false;
}
function preventLongPressMenu(node) {
node.ontouchstart = absorbEvent_;
node.ontouchmove = absorbEvent_;
node.ontouchend = absorbEvent_;
node.ontouchcancel = absorbEvent_;
}
function init() {
preventLongPressMenu(document.getElementById('theimage'));
}
</script>
</head>
<body onload="init()">
<img id="theimage" src="http://www.google.com/logos/arthurboyd2010-hp.jpg" width="400">
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
对我来说,吸收所有事件不是一个选项,因为我想禁用长按下载,同时仍允许用户缩放和平移图像.我只能通过在图像顶部分层"屏蔽"div来解决这个问题,如下所示:
<div class="img-container">
<div class="shield"></div>
<img src="path.jpg">
</div>
img {
max-width: 100%;
}
.shield {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
}
Run Code Online (Sandbox Code Playgroud)
希望这有助于某人!
它将禁用复制,但不会禁用选择。
document.oncontextmenu = function() {return false;};
Run Code Online (Sandbox Code Playgroud)
在 webView 中工作。
小智 5
我使用Nurik的完整示例,但元素(我页面中的输入图像)也被禁用了点击.
我改变原来的行:
原线:
node.ontouchstart = absorbEvent_;
Run Code Online (Sandbox Code Playgroud)
我的改变:
node.ontouchstart = node.onclick;
Run Code Online (Sandbox Code Playgroud)
使用此approuch我禁用logpress上的弹出保存图像菜单,但保持点击事件.
我在Dolphin HD浏览器下使用Android 2.2进行7英寸平板电脑测试,工作正常!
这可以使用CSS完成:
img {
pointer-events: none;
}
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
47656 次 |
最近记录: |