运用场景

在微信民众号开辟 图片预览功用，比方 多张产品图片阅读 ，微信JSSDK 已供应了 预览图片接口。效果图以下：

点击上面图片，弹出以下（这两张图，只是相似示例）

计划思绪

wx.previewImage({
    current: '', // 当前显现图片的http链接
    urls: [] // 须要预览的图片http链接列表
});

依据以上微信供应的 预览图片接口，给须要预览的图片绑定点击事宜，猎取当前点击图片的 src 地点传到 接口的current参数，猎取一切须要预览图片元素，轮回遍历，把每个图片元素 src地点 存储到数组，并传到接口的 urls 参数。

完成代码

    //加载微信JSSDK
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript" charset="utf-8"></script>
    
     //这行代码，引入了第三方微信SDK，也能够详细参考微信手册设置。
     wx.config(<?php echo  $js->config(array('previewImage'), false,false,true)  ?>);
        
     $('.imglist').click(function(event) {//绑定图片点击事宜
            
            var thisimg=$(this).attr('src');
            var imglist=$('.imglist');
            var srcs=new Array();
            for (var i =0; i <imglist.length; i++) {
            
                srcs.push(imglist.eq(i).attr('src'));
            
            }
            
      
            wx.ready(function(){
                wx.previewImage({
                    current: thisimg, // 当前显现图片的http链接
                    urls: srcs // 须要预览的图片http链接列表
                });
            });
      
            
    });