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

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


当前回答

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

适用于所有主流浏览器。

其他回答

我自己也试过,发现这很有效。

$("img").mousedown(function(){
    return false;
});

我确信这将禁用所有图像的拖动。不确定它会影响其他东西。

window.ondragstart = function() { return false; } 

jQuery:

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

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

我做的css属性显示在这里以及监视器ondragstart与以下javascript:

handleDragStart: function (evt) {
    if (evt.target.nodeName.match(/^(IMG|DIV|SPAN|A)$/i)) {
      evt.preventDefault();
      return false;
    }
  },
<img draggable="false" src="images/testimg1.jpg" alt=""/>