网页点击按钮跳转微信软件上
展开阅读全文 
<!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的DEMO1</title>
<link rel="stylesheet" href="/asserts/css/xmsCore.css" type="text/css" />
        <script src="__PUBLIC__/login/js/jquery-2.1.1.min.js"></script>
<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 = "weixin://">尝试打开起点读书</a>
    </div>
    <div class = "remark">目前在阅文集团，就以起点读书为例吧</div>
    <div class = "remark">如果安装了起点读书，那么打开，不然的话，会打开下载页</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 = 'weixin://';
  
    //如果是在微信内部点击的时候
    if(ua.indexOf("micromessenger") != -1 ){
        _openAppUrl = function(){
            alert("DEMO，请在移动端的浏览器查看！");
        }
    }else{
        //在浏览器打开，判断是在移动端还是在PC端
        if(matchVersion = navigator.userAgent.match(/OS\s*(\d+)/)){
            //赋值，并且判断
            //IOS设备的浏览器
            deviceVersion = matchVersion[1] || 0;
  
            if(deviceVersion - 9 >= 0){
                openAppType = "newType";
            }
        }else if(matchVersion = navigator.userAgent.match(/Android\s*(\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;width: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 = "weixin://";
  
    $("#tryOpenApp").on("click",function(){
        _openAppUrl(appUrl);
        return false;
    });
	
});
</script>
</body>
</html>