禁用从HTML页面中拖动图像

我需要在我的页面上放一张图片。我要禁用图像的拖拽。我尝试了很多方法，但都无济于事。有人能帮我一下吗?

我不想保留那个图像作为背景图像因为我在调整图像的大小。

当前回答

你可以将以下内容添加到你不想拖拽的每张图片中(在img标签中):

onmousedown="return false;"

如。

img src="Koala.jpg" onmousedown="return false;"

2012-08-01 12:51:01

其他回答

最简单的跨浏览器解决方案是

<img draggable="false" ondragstart="return false;" src="..." />

问题

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;
}

是它不能在firefox中工作吗

2017-04-11 12:08:33

你可以这样…

document.getElementById('my-image').ondragstart = function() { return false; };

看到它工作(或者不工作)

看起来你正在使用jQuery。

$('img').on('dragstart', function(event) { event.preventDefault(); });

2010-11-18 05:21:55

答案很简单:

<body oncontextmenu="return false"/> -禁用右键单击 <body ondragstart="return false"/> -禁用鼠标拖动 <body ondrop="return false"/> -禁用鼠标下落

2019-07-11 01:34:43

jQuery:

$('body').on('dragstart drop', function(e){
    e.preventDefault();
    return false;
});

您可以将主体选择器替换为任何其他容器，以防止子容器被拖放。

2019-10-29 10:33:06

直接使用这个: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>

适用于所有主流浏览器。

2015-09-02 23:30:00

禁用从HTML页面中拖动图像

推荐文章

最新文章

标签