应用场景

在微信公众号开发 图片预览功能，例如 多张产品图片浏览 ，微信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, 微信, 图片, 预览

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！