禁用从HTML页面中拖动图像

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

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

当前回答

jQuery:

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

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

其他回答

你可以这样…

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

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

看起来你正在使用jQuery。

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

由于我的图像是使用ajax创建的，因此在windows.load上不可用。

$("#page").delegate('img'， 'dragstart'， function(事件){event. preventdefault ();})；

通过这种方式，我可以控制哪个部分阻塞行为，它只使用一个事件绑定，它适用于未来ajax创建的图像，而无需做任何事情。

与jQuery新的绑定:

$(' # '页)。on('dragstart'， 'img'， function(event) {event. preventdefault ();})； (感谢@ialphan)

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

onmousedown="return false;"

如。

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

document.getElementById('#yourImageId').addEventListener('dragstart', function(e) {
     e.preventDefault();
});

工作在这个Plunker http://plnkr.co/edit/HbAbJkF0PVLIMjTmEZml

答案很简单:

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

推荐文章