<!DOCTYPE html> <html lang="zh-cn"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>尝试打开APP的DEMO</title> <link rel="stylesheet" href="asserts/css/xmsCore.css" type="text/css" /> <style> body{ padding:5%; } .remark{ margin-top:1em; color:#ababab; } </style> </head> <body> <h1>尝试打开APP的DEMO</h1> <div class = "custom-border border-color"> <a id = "tryOpenApp" href = "index.htm">尝试打开app</a> </div> <div class = "remark">mark</div> <div class = "remark">如果安装了app,那么打开,不然的话,会打开下载页</div> <script type="text/javascript" src="asserts/js/jquery.min.js"></script> <script> $(function () { function _openAppUrl(appUrl){ var ua = navigator.userAgent.toLocaleLowerCase(), openBrowser = null, deviceVersion = 0, matchVersion = null, openAppType = "", downLoadUrl = 'index.htm'; //如果是在微信内部点击的时候 if(ua.indexOf("micromessenger") != -1 ){ _openAppUrl = function(){ alert("DEMO,请在移动端的浏览器查看!"); } }else{ //在浏览器打开,判断是在移动端还是在PC端 if(matchVersion = navigator.userAgent.match(/OSs*(d+)/)){ //赋值,并且判断 //IOS设备的浏览器 deviceVersion = matchVersion[1] || 0; if(deviceVersion - 9 >= 0){ openAppType = "newType"; } }else if(matchVersion = navigator.userAgent.match(/Androids*(d+)/)){ //Android的设备 deviceVersion = matchVersion[1] || 0; if(deviceVersion - 5 >= 0){ openAppType = "newType"; } }else{ //PC端的设备 openAppType = "pc"; } if(openAppType == "pc"){ _openAppUrl = function(){ alert("DEMO,请在移动端的浏览器查看!"); } }else if(openAppType == "newType"){ //使用新的方法,尝试打开APP //IOS>9,Android>5的版本 _openAppUrl = function(url){ var history = window.history, body = $("body").eq(0), ifr = $('<iframe class = "full-screen dn" style = "z-index:101;border:none;100%;height:100%;" src="'+downLoadUrl+'"></iframe>'); body.append(ifr); $(window).on("popstate",function(e){ var state = history.state; if(!state){ ifr.addClass("dn"); } }); function _show(){ history.pushState({}, "下载APP链接页", ""); ifr.removeClass("dn"); } _openAppUrl = function(url){ location.href = url; _show(); } _openAppUrl(url); } }else{ //使用计算时差的方案打开APP var checkOpen = function (cb){ var _clickTime = +(new Date()), _count = 0, intHandle = 0; //启动间隔20ms运行的定时器,并检测累计消耗时间是否超过3000ms,超过则结束 intHandle = setInterval(function(){ _count++; var elsTime = +(new Date()) - _clickTime; if (_count>=100 || elsTime > 3000 ) { clearInterval(intHandle); //计算结束,根据不同,做不同的跳转处理,0表示已经跳转APP成功了 if ( elsTime > 3000 || document.hidden || document.webkitHidden) { cb(0); } else { cb(1); } } }, 20); } _openAppUrl = function(url){ var ifr = document.createElement('iframe'); ifr.src = url; ifr.style.display = 'none'; checkOpen(function(opened){ if(opened === 1){ location.href = downLoadUrl; } }); document.body.appendChild(ifr); setTimeout(function() { document.body.removeChild(ifr); }, 2000); } } } _openAppUrl(appUrl); } var appUrl = "QDReader://"; $("#tryOpenApp").on("click",function(){ _openAppUrl(appUrl); return false; }); }); </script> </body> </html>