微信小程序富文本解析点击图片放大_小程序富文本提取图片可放大缩小

本文实例为大家分享了小程序富文本提取图片可放大缩小的具体代码，供大家参考，具体内容如下

启发：

因为最近有需求说在小程序商品的详情页里所有图片可以放大缩小，网上好像不太好找，就写了篇博客，供大家参考

step1

获取到富文本内容，怎么获取就是请求数据嘛，这个不在赘述了。

var nodes = res.data.data.content;

step2

检测 nodes中是否有img标签，这个有很多方法，我这里用的indexOf

if (nodes.indexOf("src") >= 0) {

}

step3

第三步就是用正则全局匹配img标签，并且替换成空，这里setData是为了把图片添加到wxml显示的，说下match和captrue，第一个是带有img标签的返回值，第二个是src的值

//s3:正则匹配所有图片路径

var imgs = [];

nodes = nodes.replace(/]*src=['"]([^'"]+)[^>]*>/gi, function (match, capture) {

imgs.push(capture);

that.setData({

imgs: imgs

});

return '';

});

step4

最后就是把