最近在微信开发中用到了点击图片查看预览图的效果。在网上搜到了两种解决方案,大家可以作为参考:
解决方案一:
http://www.mamicode.com/info-detail-124081.html
解决方案二:
http://www.cnblogs.com/xinlinux/p/4223338.html
经过测试发现都有bug,所以自己理解分析了一下,说一下
调用微信接口实现图片预览效果 双指放大图片
的实现思路。
1. 获取到当前显示的图片的http链接,预览的图片的http连接列表
2. 在图片上绑定click事件,调用微信预览图片接口
微信JS-SDK——
预览图片接口
wx.previewImage({
current: '', // 当前显示图片的http链接
urls: [] // 需要预览的图片http链接列表
});
<script src="js/jquery.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
$(function(){
var imgsurl=[];
var nowurl='';
var imgObj=$("#content img");
for(var i=0;i<imgObj.length;i++){
imgsurl[i]=imgObj[i].src;
imgObj[i].οnclick=function(){
nowurl=this.src;
wx.previewImage({
current: nowurl,
urls: imgsurl
});
}
}
});
</script>
版权声明:本文为tangtang5963原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。