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

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


当前回答

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

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

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

与jQuery新的绑定:

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

其他回答

答案很简单:

<body oncontextmenu="return false"/> -禁用右键单击 <body ondragstart="return false"/> -禁用鼠标拖动 <body ondrop="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(); });

这是用JQuery实现的一种优雅方式

$("body").on('mousedown','img',function(e){
    e.stopPropagation();
    e.preventDefault();
});

on函数向选定的元素攻击一个或多个事件的事件处理程序函数

为此,您可以使用内联代码

<img draggable="false" src="http://www.ourkanpur.com/images/logo.png">

第二个选择是使用外部或页面上的css

img { -moz-user-select:没有; -webkit-user-select:没有; -ms-user-select:没有; 用户选择:没有; -webkit-user-drag:没有; user-drag:没有; -webkit-touch-callout:没有; } < img src = " http://www.ourkanpur.com/images/logo.png " >

两者都正常工作 我在这个网站上使用外部css(点击这里)