禁止移动端点击图片出现预览的默认行为

在移动端开发中，某些设备会存在点击img标签，

图片呈现预览模式，但是我们没有给图片添加任何事件

这是移动端浏览器的默认行为，解决方式如下：

 

1、在img标签上添加 onclick="return false"

<img src="a.png" onclick="return false" />

 

2、图片用背景图的方式插入

background: url(a.png) no-repeat;

 

3、使用js事件阻止默认行为

var img = document.getElementById('img');
img.addEventListener('click', function(e){
   e.preventDefault(); 
})

 

另外可以用css方式解决：

img{ pointer-events: none; }

但是该方法会导致图片的点击事件失效

如果只是单纯展示图片，而没有什么交互的话，这个方法还是可以的~