项目需求
需求是：在微信里公众号有萌的成长印记模块，图片绑定了一个点击事件。大家都知道，在手上访问H5页面的时候，长按图片就会把图片保存起来。我们需要长按的时候不保存图片。还能触发点击事件。
一、如何想要图片不被保存
图片上边加一层div类似于遮罩层，这样图片就不会被点击，右击也不会出现如图的图片另存为。
二、对这层添加点击事件处理相关逻辑
三、代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>禁止微信长按保存图片</title>
<style type="text/css">
.imag{
position: relative;
width: 80%;
margin: 0 auto;
margin-top: 20px;
}
.imshar{
position: absolute;
z-index: 100;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 0;
}
.imag img{
display: block;
width: 100%;
}
</style>
</head>
<body>
<div class="imag">
<div class="imshar" onclick="fn()"></div>
<img src="http://images.cnblogs.com/cnblogs_com/xiaoxiaokun/1007663/o_xiaoxiaokun.png"/>
</div>
<script type="text/javascript">
function fn(){
alert("处理你想要处理的事情！不可以保存图片")
}
</script>
</body>
</html>
总结：
其实做技术的时候我们要想一下，其他方案，不能纠结于事件处理，也许能用css与html就可以处理掉呢！只有做出来给用户看不出问题就行啦！
开始想的用css解决，设置img{
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-webkit-user-select:none;
-o-user-select:none;
user-select:none;
}
这样长按是不会弹出默认菜单不能保存图片了，但是点击事件也用不了了！
原文链接：https://www.cnblogs.com/xiaoxiaokun/p/7181952.html
