禁止移动端浏览器点击图片弹出预览放大等动作的方法

　　最近在写移动端项目开的时候，在一个div中引用img标签。运行项目后，点击该图片的时候，会发现图片呈现预览模式，但是我们没有给图片添加任何的click事件，效果如下：

　　点击前：

　　点击后：

　　这是因为移动端浏览器的默认行为，那么该如何解决呢?

解决办法

1、在img元素上添加 onclick="return false"

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

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

background:url(a.png) norepeat center;

3、.使用js事件阻止默认行为的方法，这里需要注意哦！

var img=document.getElementsByTagName("img");
for(var i=0;i<img.length;i++){
    img[i].addEventListener('click',function(e){
        e.preventDefault();
    });
}

      关于这里的click事件，其实也可以是touchend事件，但是不可以是touchstart和touchmove事件！

      因为使用touchstart和touchmove事件的时候，假如页面顶部有个超级大的banner图，那么当横屏显示或者类似于ipad等屏幕宽度大于高度的情况下，整个banner图都占满了屏幕，这个时候页面没法滑动。因为你用touchstart和touchmove禁止掉了图片的默认行为，所以手指怎么滑动，页面都没反应的。刚好这个滑动的行为触发了touchstart和touchmove。