你可能也遇到过，朋友通过微信发给你的连接，有些操作不能直接进行，会引导你去浏览器打开。那么这个功能时如何实现的呢，首先网页要判断是不是在微信浏览器中被打开，如果是再引导用户新打开浏览器访问。
那么是如何判断微信浏览器的呢，可以参考下方代码判断：
- <html lang=”en”>
- <head>
- <meta charset=”utf-8″/>
- <title>判断网页是否在微信内置浏览器中打开</title>
- <style>
- .wxtip{background: rgba(0,0,0,0.8); text-align: center; position: fixed; left:0; top: 0; width: 100%; height: 100%; z-index: 1998; display: none;}
- .wxtip-icon{width: 52px; height: 67px; background: #111; display: block; position: absolute; right: 20px; top: 20px;}
- .wxtip-txt{margin-top: 107px; color: #fff; font-size: 16px; line-height: 1.5;}
- </style>
- </head>
- <body>
- <div class=”wxtip” id=”JweixinTip”>
- <span class=”wxtip-icon”></span>
- <p class=”wxtip-txt”>点击右上角<br/>选择在浏览器中打开</p>
- </div>
- </body>
- </html>
- <script type=”text/javascript”>
- /* 智能机浏览器版本信息: */
- var browser = {
- versions: function() {
- var u = navigator.userAgent, app = navigator.appVersion;
- return {//移动终端浏览器版本信息
- trident: u.indexOf(‘Trident’) > -1, //IE内核
- presto: u.indexOf(‘Presto’) > -1, //opera内核
- webKit: u.indexOf(‘AppleWebKit’) > -1, //苹果、谷歌内核
- gecko: u.indexOf(‘Gecko’) > -1 && u.indexOf(‘KHTML’) == -1, //火狐内核
- ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
- android: u.indexOf(‘Android’) > -1 || u.indexOf(‘Linux’) > -1, //android终端或者uc浏览器
- iPhone: u.indexOf(‘iPhone’) > -1 || u.indexOf(‘Mac’) > -1, //是否为iPhone或者QQHD浏览器
- iPad: u.indexOf(‘iPad’) > -1, //是否iPad
- webApp: u.indexOf(‘Safari’) == -1, //是否web应该程序，没有头部与底部
- wechar:u.indexOf(‘MicroMessenger’) > -1
- };
- }(),
- language: (navigator.browserLanguage || navigator.language).toLowerCase()
- }
- /* 判断的方法 */
- if(browser.versions.wechar){
- document.getElementById(‘JweixinTip’).style.display=’block’;
- }
- if (browser.versions.ios || browser.versions.iPhone || browser.versions.iPad) {
- document.getElementById(‘JweixinTip’).style.display=’block’;
- }
- else if (browser.versions.android) {
- document.getElementById(‘JweixinTip’).style.display=’none’;
- }
- </script>
复制代码
以上，就是通过js代码判断网页是不是在微信内置浏览器打开的实现方法。
发表评论 取消回复