我需要在我的页面上放一张图片。我要禁用图像的拖拽。我尝试了很多方法，但都无济于事。有人能帮我一下吗?
我不想保留那个图像作为背景图像因为我在调整图像的大小。
当前回答
为图像设置以下CSS属性:
user-drag: none;
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;
其他回答
直接使用这个:ondragstart="return false;"在你的图像标签。
<img src="http://image-example.png" ondragstart="return false;"/>
如果你有多个图像，用<div>标签包装:
<div ondragstart="return false;">
<img src="image1.png"/>
<img scr="image2.png"/>
</div>
适用于所有主流浏览器。
这是用JQuery实现的一种优雅方式
$("body").on('mousedown','img',function(e){
e.stopPropagation();
e.preventDefault();
});
on函数向选定的元素攻击一个或多个事件的事件处理程序函数
我自己也试过，发现这很有效。
$("img").mousedown(function(){
return false;
});
我确信这将禁用所有图像的拖动。不确定它会影响其他东西。
img {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-drag: none;
user-drag: none;
-webkit-touch-callout: none;
}
我在自己的网站http://www.namdevmatrimony.in/上使用了它 这就像魔法一样!!：）
你可以这样…
document.getElementById('my-image').ondragstart = function() { return false; };
看到它工作(或者不工作)
看起来你正在使用jQuery。
$('img').on('dragstart', function(event) { event.preventDefault(); });
