1. 程式人生 > >js h5頁面調起App(IOS 和android)的實現方法

js h5頁面調起App(IOS 和android)的實現方法

js h5頁面調起App(IOS 和android)的實現方法

第一次寫這個:我們的app是由原聲和h5組成的,當用戶使用瀏覽器開啟我們的頁面時我們會引導使用者使:開啟App 下載App
剛開始我是使用定時器來實現的,當用戶點選了開啟App經過一定時間之後沒有反應,則我們認為她調起App失敗,跳轉到下載頁面,但是這個存在一個問題,起始已經調起App了但是使用者沒有允許開啟App過了一定時間之後下載的頁面還是會彈出來,這樣就不合理了,已經有App了還提示要下載。同時還有個問題我的手機是r11 7.1.1系統自帶瀏覽器一直調不起App(上面實現的方法是當瀏覽器載入h5頁面時就會執行),因此我把調起App和下載的地址分開了,測試了一些手機相容性還不錯,都可以調起和實現下載。用按鈕

來實現。
具體程式碼如下:
//下面為使用者掃描二維碼時進行的跳轉

 var userAgent = window.navigator.userAgent;
        if (userAgent.match(這裡用來區別使用者是在瀏覽器開啟還是App內開啟) == null) {//當用戶在瀏覽器中開啟時
            document.getElementById("app_button").style.display = "block";//下載開啟按鈕顯示出來
            if (userAgent.match(/MicroMessenger/) != null) {//用微信掃描時
                document.getElementById("weixin").style.display = "block";
                //下面根據不同的手機顯示不同的提示語
                if (mui.os.ios) {
                    document.getElementById("addroid_weixin").style.display = "none";
                    document.getElementById("ios_weixin").style.display = "inline";
                } else if (mui.os.android) {
                    document.getElementById("ios_weixin").style.display = "none";
                    document.getElementById("addroid_weixin").style.display = "inline";
                }
                document.getElementById("app_button").style.display = "none";
            }
        }
        var parameter = window.location.href;
        var ios_parmeter = parameter.substring(7, parameter.length);
        document.getElementById("open_app").addEventListener('tap', function () {
            if (mui.os.ios) {
                window.location.href = "開啟IOS的名字://" + ios_parmeter;
            } else if (mui.os.android) {
                window.location.href = "開啟App的名字://hrst.com/android?data=" + parameter;
            }
        });
        document.getElementById("download_upgrade").addEventListener('tap', function () {
            if (mui.os.ios) {
            //跳轉IOS下載商城地址
                window.location.href = "https://itunes.apple.com/cn/app/";
            } else if (mui.os.android) {
                var downLoad = '@ViewBag.downLoad';
                window.location.href = "android的下載地址";
            }
        });