企业微信预览图片的接口使用wx.previewImage

我就是我 2023-10-03 13:03 67阅读 0赞

## 企业微信wx.previewImage接口 ##

*  功能：页面上点击图片，然后图片放大进行预览（此处是身份证照片）

<div class="weui-cell weui-cell_active weui-cell_readonly">
       <div class="weui-cell__hd"><label class="weui-label">身份证正面</label></div>
       <div class="weui-cell__bd">
           <img src="${baseUri}/img?img=idCardFront&id=${id?c}"
                width="100" height="100" id="idCardFront" onclick="previewImg('idCardFront') ">
       </div>
    </div>
    <div class="weui-cell weui-cell_active weui-cell_readonly">
       <div class="weui-cell__hd"><label class="weui-label">身份证反面</label></div>
       <div class="weui-cell__bd">
           <img src="${baseUri}/img?img=idCardBack&id=${id?c}"
                width="100" height="100" id="idCardBack" onclick="previewImg('idCardBack')">
       </div>
    </div>

*  说明:baseUri是后端传过来的https,bizId是传过来的id
 *  图片上面添加一个点击事件，当我们点击图片的时候，触发点击事件，将id传到点击事件

function previewImg(imgId) {
        
         var nowurl = $("#" + imgId).attr("src");
         // console.log(nowurl);
         wx.previewImage({
        
             current: nowurl,  // 当前显示图片的http链接
             // urls: imgsurl  // 需要预览的图片http链接列表
         });
     };

*  说明：图片点击后，传来id，获取到该id的src，放到wx.previewImage里面的currrnt即可，因为我们点击一个图片就预览一个图片，所以此处不需要http链接列表

发表评论取消回复

表情：

评论列表（有 0 条评论，67人围观）

还没有评论，来说两句吧...

相关阅读

相关微信图像预览接口调用例子

var $images = $("content").find("img"); var imgPaths = [];

小鱼儿/ 2024年02月17日 16:55/ 0 赞/ 160 阅读

相关企业微信预览图片的接口使用wx.previewImage

企业微信wx.previewImage接口功能：页面上点击图片，然后图片放大进行预览（此处是身份证照片） <div class="weui-cell w

我就是我/ 2023年10月03日 13:03/ 0 赞/ 68 阅读

相关微信图片预览

微信公众号开发中，点击查看大图，其实不需要再写js效果直接调用微信app的预览功能即可用例： <script> //图片列表

男娘i/ 2022年08月04日 13:47/ 0 赞/ 592 阅读

相关微信图片点击预览

$(function(){ var imgsurl=[]; var nowurl=''; var imgObj=$(".swi

快来打我*/ 2022年06月08日 09:50/ 0 赞/ 1107 阅读

相关 H5调用微信图片显示预览

// 首选你要开心的引入下js <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></sc

深藏阁楼爱情的钟/ 2022年05月11日 06:18/ 0 赞/ 658 阅读

相关微信小程序：点击图片预览

做微信小程序的时候使用的图片大小不尽相同，为了让使用者能够浏览原图，就需要给图片添加点击预览的功能，下面我详细介绍一下实现步骤，首先介绍微信小程序文档中的使用教程： ![

妖狐艹你老母/ 2022年04月03日 03:14/ 0 赞/ 829 阅读

相关微信内置浏览器微信放大、预览图片官方接口

\ img图片一定是http开头非标准方法-不确定WeixinJSBridge可以用多久 function getImage() {

﹏ヽ暗。殇╰゛Y/ 2021年11月15日 13:10/ 0 赞/ 721 阅读

相关微信小程序选择图片和预览图片

选择图片视频中,老师也是看着官方文档,为学生们讲解,微信提供了系统的方法来选择图片. wx.chooseImage(\{\}) 此方法是用来选择图片的方法,具体使用

素颜马尾好姑娘i/ 2021年09月17日 00:28/ 0 赞/ 794 阅读

相关微信小程序wx.previewImage预览图片

一.小知识 ![20170525131248116][] 二.例子 1.wxml <view class="container"> <view wx:fo

ゞ浴缸里的玫瑰/ 2021年09月12日 07:30/ 0 赞/ 755 阅读

相关企业微信系列之JSSDK文件预览对接

企业微信系列之JSSDK文件预览对接 > 企业微信JS-SDK是企业微信面向网页开发者提供的基于企业微信内的网页开发工具包。 > 通过使用企业微信JS-SDK，网页开发者

迈不过友情╰/ 2021年09月07日 17:52/ 0 赞/ 449 阅读