微信JSSDK 预览图片接口 开发

应用场景 在微信公众号开发 图片预览功能,例如 多张产品图片浏览 ,微信JSSDK 已经提供了 预览图片接口。效果图如下: 点击上面图片,弹出以下(这两张图,只是类似示例) 方案思路 wx.previewImage({ current: '', // 当前显示图片的http链接 urls: [] // 需要预览的图片http链接列表 }); 根据以上微信提供的 预览图片接口

应用场景

在微信公众号开发 图片预览功能,例如 多张产品图片浏览 ,微信JSSDK 已经提供了 预览图片接口。效果图如下:

点击上面图片,弹出以下(这两张图,只是类似示例)

方案思路

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

根据以上微信提供的 预览图片接口,给需要预览的图片绑定点击事件,获取当前点击图片的 src 地址传到 接口的current参数,获取所有需要预览图片元素,循环遍历,把每一个图片元素 src地址 存储到数组,并传到接口的 urls 参数。

实现代码

//加载微信JSSDK


 //这行代码,引入了第三方微信SDK,也可以具体参考微信手册配置。
 wx.config(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 

关键字:JavaScript, 微信, 图片, 预览