JS調起APP,沒有app則跳轉至應用市場

HTML

<div class="container">
	<div id="btn_download" class="card-btn card_item">
    	立即下載
 	</div>
</div>
<div class="mask" @click="hide">
   <ol>
      <li>點擊右上角</li>
      <li>瀏覽器打開</li>
   </ol>
</div>

JS方法

// 點擊事件
document.querySelector('#btn_download').onclick = function () {
        toApp();
}
// 調起APP
    function toApp() {
        var btn_download = document.getElementById("btn_download");
        var ua = window.navigator.userAgent.toLowerCase();
        var isweixin =
            navigator.userAgent.toLowerCase().match(/micromessenger/i) != null;
        var isqq = navigator.userAgent.toLowerCase().indexOf("qq/") > -1;
        var isweibo = ua.match(/weibo/i) == "weibo";
        if (isweixin || isweibo) {
            document.getElementsByClassName("mask")[0].style.display = "block";
            document.body.addEventListener('touchmove', bodyScroll, false);
            document.documentElement.style.overflow = 'hidden';
            document.body.style.overflow = 'hidden';
            // 如果是安卓微信瀏覽器
            if (/android/i.test(navigator.userAgent)) {
                alert("安卓微信瀏覽器");
            }
            // 如果是iOS微信瀏覽器
            else if (/ipad|iphone|mac/i.test(navigator.userAgent)) {
                alert("iOS微信瀏覽器 ");
            }
        } else {
            if (/android/i.test(navigator.userAgent)) {
                if (!isweixin && !isqq) {
                    btn_download.setAttribute("href", "ops://");
                    this.openandIndex();
                }
            } else if (/ipad|iphone|mac/i.test(navigator.userAgent)) {
                if (!isweixin && !isqq) {
                    window.location.href = "com.dakang.mentalhealth://";
                    openiosIndex();
                } else if (isqq) {
                    btn_download.setAttribute("href", "com.dakang.mentalhealth://");
                    openiosIndex();
                }
            }
        }
    }
    // 安卓下載鏈接
    function openandIndex() {
        var t = setTimeout(function () {
            window.location.href = "******" //安卓的APP下載地址
        }, 3000);
        setTimeout(function () {
            clearTimeout(t);
        }, 3500);
    }
    // ios下載鏈接
    function openiosIndex() {
        var t = setTimeout(function () {
            window.location.href = "******"; //ios的APP下載地址
        }, 1500);
        setTimeout(function () {
            clearTimeout(t);
        }, 1500);
    }

CSS樣式

.mask {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            display: none;
            text-align: center;
            line-height: 100%;
            font-size: 1.2rem;
            color: #333;
            background-color: rgba(242, 242, 242, 0.7);
        }

        ol {
            position: absolute;
            top: 30%;
            left: 35%;
        }

        ol li {
            margin-bottom: 30px;
        }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章