h5页面 app下载页判断安卓、ios 、微信以及判断pc端或者移动端（若为pc端跳转另一个页面）

最新推荐文章于 2024-02-05 15:59:23 发布

原创最新推荐文章于 2024-02-05 15:59:23 发布 · 972 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#下载 #h5 #ios #安卓 #微信

js 同时被 3 个专栏收录

16 篇文章

订阅专栏

css

11 篇文章

订阅专栏

移动端

3 篇文章

订阅专栏

本文介绍了一种在网页加载时自动判断用户设备类型（iOS、Android）及是否在微信环境中打开的方法。通过navigator.userAgent属性，可以实现针对不同平台进行定制化操作，如调整页面布局以适应手机浏览器分辨率，确保下载按钮正确显示。

初始进页面就判断是ios端还是安卓端

window.onload=function(){
    var u = navigator.userAgent;
    //判断是否为Android
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;
    //判断是否为ios
    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
    //判断是否为微信
    var ua = window.navigator.userAgent.toLowerCase();
    var isWeixin = ua.match(/MicroMessenger/i) == 'micromessenger'
    if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {   //移动端需要做的事情
	     if (isAndroid) {
	        做些什么。。。
	    }
	    if (isIOS) {
	      	做些什么。。。
	    }
	    if（isWeixin）{
	   		做些什么。。。
	    }
    }else{
    		//pc端跳转的页面
    }
}

下载页下边的下载按钮用定位，定位，定位！！！否则因为手机浏览器分辨率的问题按钮的位置不对
（此问题还是后端的哥解决的尴尬。。。）