2018-05-14 14:12:07 kxy17 阅读数 1224
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27842 人正在学习 去看看 秦子恒

最近在做微信公众号开发,开发过程中遇到了一个图片全屏预览,用微信JSSDK的previewImage({current: curImg, urls: imgUrls})接口写,后面发现点击图片的时候出现了两次预览,要后退两次才能退出,查了好久查不到原因,后面发现是因为图片 ,宽度大于一定值(我目前是260px),微信会自动把图片变成点击全屏预览,导致每次点击都触发了两次预览,

解决方案:

给图片设置 

pointer-events: none;

需要点击事件则给图片外面加层div,将点击事件放在div上即可,如在div上点击调用微信jssdk的图片预览接口

2018-11-14 15:00:23 skyblacktoday 阅读数 1356
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27842 人正在学习 去看看 秦子恒

方案一:

1.在index.html页面引入js

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>


2..vue文件的html中

<div class="image"><img :src="item.content" @click="seeBigTu(item.content)"> </div>

3.函数调用


seeBigTu(value) {
          
  WeixinJSBridge.invoke('imagePreview', {
     'urls': [value],
     'current': value
  });
             
}

 

方案二:

1.npm安装:

npm install weixin-js-sdk --save

2.在main.js里面引入

import wx from 'weixin-js-sdk';

3. 同方案一 3

2016-12-08 12:04:11 tangtang5963 阅读数 20197
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27842 人正在学习 去看看 秦子恒
最近在微信开发中用到了点击图片查看预览图的效果。在网上搜到了两种解决方案,大家可以作为参考:

解决方案一:http://www.mamicode.com/info-detail-124081.html

解决方案二:http://www.cnblogs.com/xinlinux/p/4223338.html

经过测试发现都有bug,所以自己理解分析了一下,说一下调用微信接口实现图片预览效果 双指放大图片的实现思路。

1. 获取到当前显示的图片的http链接,预览的图片的http连接列表

2. 在图片上绑定click事件,调用微信预览图片接口

微信JS-SDK——预览图片接口

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


<script src="js/jquery.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
$(function(){
	var imgsurl=[];
	var nowurl='';
	var imgObj=$("#content img");
	for(var i=0;i<imgObj.length;i++){
		imgsurl[i]=imgObj[i].src;
		imgObj[i].onclick=function(){
			nowurl=this.src;
			wx.previewImage({
			    current: nowurl,
			    urls: imgsurl
			});				
		}
	}
});
</script>


2018-07-06 11:33:15 weixin_42011096 阅读数 1355
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27842 人正在学习 去看看 秦子恒

1.问题:微信点击图片会预览

2.思路

(1)不让其点击

(2)阻止默认事件

3.解决方案

(1)不让其点击:

为图片添加以下属性

pointer-events: none;

或者:

为该img加一个div,只不过div的层在img的上面所以采用z-index进行层的浮动

(2)阻止默认事件

为img添加以下代码(这是vue中的写法)

@click.prevent="(()=>{return false})"

js中的写法:为img添加的点击事件

function () {
  window.event?window.event.returnValue = false : e.preventDefault();
}

2017-11-07 16:23:23 leileitime 阅读数 593
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27842 人正在学习 去看看 秦子恒

$(".weui_uploader_files li").click(function(e) {
var thisPath = webRoot + $(this).attr("path");
var lis = $(this).siblings();
var imgs = new Array();
for (i = 0; i < lis.length; i++) {
var photoPath = lis[i].getAttribute("path");
imgs.push(webRoot + photoPath);
}
wx.previewImage({
current : thisPath,
urls : imgs
});
});

微信图片预览

阅读数 2951

没有更多推荐了,返回首页