调用微信内置浏览器实现微信打开的网页上的图片能点击打开的效果

最新推荐文章于 2024-12-29 19:10:59 发布

原创

最新推荐文章于 2024-12-29 19:10:59 发布

· 3.6k 阅读

版权

文章标签：

微信内置浏览器默认限制了网页中图片的点击打开，要实现图片预览功能，可以利用WeixinJSBridge的imagePreview接口。通过引用jQuery，为需要点击的图片添加'openImg'类，然后编写JS代码触发预览。部署到服务器后，微信用户就能点击图片预览了。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述为啥微信打开的网页有的图片能点击打开，有的不能呢？因为微信内置浏览器对打开的网页做了限

制。一般我们使用微信的时候都不会特意修改浏览器，所以如果不做处理的话，微信打开的网页上的图

片一般是无法点开的。要想点开微信打开的网页上的图片，就要调用微信的内置私有接口

WeixinJSBridge 中的图片查看器的预览属性imagePreview 。

在这里插入图片描述 1. 引用jQuery

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>

在这里插入图片描述 2. 编写JS代码

需要注意的点：
①因为是测试版本，我的html和静态资源是放在一起，然后直接部署到服务器上的，所以需要拼接字符串。不需要的直接采用注释里的代码。
②获取指定的img对象，需要把要点击的图片的img标签上添加 class = “openImg”。