6

有个说法是微信浏览器==移动端IE6。分享一下开发中遇到的坑

1.在自己的公众号能实现支付,从别的公众号进来不能支付。

既然自己的公众号能支付了,那么很有可能是跳转过来的公众号的url出现的问题。
正确的:htt P://3w.yijia.com/wechat/pay/?id=1
错误的:htt P://3w.yijia.com/wechat/pay?id=1 参数(也就是问号之前)要以/结尾,因为这是公众号支付配置的要求。

2.微信api上传图片,在苹果和安卓系统下的小区别。问题描述:要上传多张图片。在安卓手机上传成功;在苹果手机那里只能上传成功最后一张。

解决方法:苹果使用递归函数上传。


3.iframe 中如果有输入框,在苹果手机下弹出软键盘时,会导致宽度无法适配

代码:

        $(window).resize(function () { 
            $('iframe').css("width",$(window).width());
        });

并在iframe上 增加属性

<iframe frameborder=0 scrolling="no"></iframe> 


4.绝对定位的元素被键盘顶起来。

解决方式:https://segmentfault.com/a/11...
如果使用一些时间插件,地址选择插件,是从底部弹起来的又要绝对定位的。又要设计input的。建议改为从屏幕中间弹出。

5.音频无法自动播放

 //一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以
 document.getElementById('car_audio').play();
//必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
document.addEventListener("WeixinJSBridgeReady", function () {
    document.getElementById('audio').play();
    document.getElementById('video').play();
}, false); 

6.vue2.0路由(react不知道)采用history 在IOS中模式无法识别二维码

这个我这的服,一直没找到解决方法,后来改用哈希路由。

7.输入框在IOS中设置只读readonly="readonly" 时,点击扔出现光标。

$('input[readonly]').on('focus', function() {
            $(this).trigger('blur');
});


8.微信缓存。

手动清理http://debugx5.qq.com 手机打开 拉到最后,把4个选上。
本文仅提供php代码,js的自行查找。因为考虑到js是在css加载完成之后才执行的。所以要把动态生成随机数或时间戳的js放到适当的位置。比如你的css是放在head标签里面的。但是你的css是不想被缓存的,要在url后面生成一些动态信息,那么在引入该css的下面就要紧接着js代码。

<link rel="stylesheet" href="/modules/wechatmp/statics/css/1111.css?v=<?php echo time(); ?> " />
<script class='math' src="/modules/wechatmp/statics/js/11111.js?ver=<?php echo time(); ?> "></script>

9.微信分享链接不支持

微信分享接口不支持hash传递。

带有hash的url分享朋友圈的时候,跳转信息中 不包含hash信息。例如:

view/guide/home.php#share/service/detail/

只能得到:

view/guide/home.php

建议:分享的时候不要带hash信息。如果一定要带附加信息,可以转为:

view/guide/home.php?share/service/detail/。

在做单页面应用的时候,如果要分享当前页面的动态数据,要把参数拼接到url后面。页面之间使用路由传参,并用get请求。


不请自来
1.2k 声望5 粉丝

最近重新整理一个项目[链接]