移動端 --- 阻止瀏覽器點擊圖片會預覽的方法

下面介紹幾種方法：

1. 在img元素上添加 onclick="return false" （推薦）

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

 

2. 圖片用背景圖的方式插入

background:url(a.png) norepeat center;

 

3. 使用js事件阻止默認行爲的方法，這裏須要注意哦！

var img = document.getElementById('banner');

img.addEventListener('click',function(e){

　　e.preventDefault();

});

關於這裏的click事件，其實也能夠是touchend事件，可是不能夠是touchstart和touchmove事件！

由於使用touchstart和touchmove事件的時候，假如頁面頂部有個超級大的banner圖，那麼當橫屏顯示或者相似於ipad等屏幕寬度大於高度的狀況下，整個banner圖都佔滿了屏幕，這個時候頁面無法滑動。由於你用touchstart和touchmove禁止掉了圖片的默認行爲，因此手指怎麼滑動，頁面都沒反應的。恰好這個滑動的行爲觸發了touchstart和touchmove。