微信内部浏览器打开网页时提示外部浏览器打开升级版探讨-直接跳转默认浏览器打开
2019-01-13 17:08
676 查看
在涉及移动端支付的项目时,由于对支付需求的精细化,不仅需要扫码支付,还有唤醒App支付,另外还有在微信、QQ、支付宝内置浏览器给出相应的提示。
好在国内各大巨头公司在开发浏览器的时候都在浏览器标识上加了相应的字符,下面直接贴代码:
function is_neizhi() { var ua = navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == "micromessenger") { return "weixin"; } else if (ua.match(/QQ/i) == "qq") { return "QQ"; } else if (ua.match(/Alipay/i) == "alipay" && payway == 2) { return "alipay"; } return false; }
由此可以判断是否是App内置浏览器或者更加精细到某App内置浏览器。但是略坑的是:微信支付不管是在QQ、微信还是支付宝内置浏览器里面都不能被唤醒;支付宝支付可以在支付宝内置浏览器唤醒,其余则不能。
在外部浏览器打开是用jquery遮罩层方式写的,下面直接贴代码:
var isNeizhi = is_neizhi(); //调用上面js判断 var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight; //网页可视区高度 var weixinTip = $('<div id="weixinTip"><p><img src="live_weixin.png" alt="微信打开"/></p></div>'); if(isNeizhi){ $("body").append(weixinTip); } $("#weixinTip").css({ "position": "fixed", "left": "0", "top": "0", "height": winHeight, "width": "100%", "z-index": "1000", "background-color": "rgba(0,0,0,0.8)", "filter": "alpha(opacity=80)", }); $("#weixinTip p").css({ "text-align": "center", "margin-top": "10%", "padding-left": "5%", "padding-right": "5%" }); $("#weixinTip p img").css({ "max-width": "100%", "height": "auto" });
当然,提示的图片素材你得要有一张,最终效果如下:
效果图相关文章推荐
- 微信内部浏览器打开网页时提示外部浏览器打开 升级版
- 微信中点击链接或者扫描二维码直接跳转外部浏览器打开指定网页下载
- 微信提示浏览器打开代码升级版 微信自动跳转默认浏览器
- 微信中点击链接或者扫描二维码直接跳转外部浏览器打开指定网页下载
- 微信中点击链接或者扫描二维码直接跳转外部浏览器打开指定网页下载
- 微信跳转浏览器提示,微信浏览器中直接跳转手机默认浏览器
- 如何设置微信点击链接或扫一扫二维码跳转外部浏览器打开网页下载
- 如何设置微信点击链接或扫一扫二维码跳转外部浏览器打开网页下载
- 微信中安卓手机点击链接强制跳转默认浏览器打开指定网页
- 微信中如何通过手机系统默认外部浏览器打开指定网页URL
- 微信中安卓手机点击链接强制跳转默认浏览器打开指定网页
- 微信扫描二维码跳转手机默认浏览器打开下载app的链接是怎么实现的
- 微信域名网址强制跳转至浏览器打开指定HTML网页
- 微信打开网址后自动调用手机自带默认浏览器或提示选择浏览器打开如何实现
- 微信发一个网址打开后自动调用手机自带默认浏览器或提示选择浏览器打开如何实现?
- 在微信中点击链接直接跳转到手机默认浏览器代码实现
- 微信打开网址后自动调用手机自带默认浏览器或提示选择浏览器打开如何实现
- 微信扫一扫二维码直接打开外部浏览器下载app怎么解决
- 微信扫一扫直接打开手机外部浏览器
- 微信内置浏览器调起外部浏览器打开指定网页连接