前段时间，小颖公司需要实现：用户在微信中打开一个html5，在该html5中通过点击下载按钮，Android手机会跳到Android的下载地址，IOS会跳转到IOS下载地址，其它则跳转到另一个指定地址。
1.若用户是在浏览器中打开该html5，点击下载按钮后会跳转到相应的版本app下载地址。
2.若用户在微信中打开该html5，则先提示用户，用浏览器打开该html5，然后在浏览器中打开该html5后，再点击下载按钮跳转到相应的版本app下载地址。
具体实现方法：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>安装</title>
</head>
<body>
<div class="view-container">
<div class="etc-handle">
<a href="javascript:void(0)" rel="external nofollow" onclick="downApp()">点击安装</a>
</div>
</div><script type="text/javascript">
(function(){
window.alert = function(name){
var iframe = document.createElement("IFRAME");
iframe.style.display="none";
iframe.setAttribute("src", 'data:text/plain');
document.documentElement.appendChild(iframe);
window.frames[0].window.alert(name);
iframe.parentNode.removeChild(iframe);
}
})();
var browser = {
versions: function () {
var u = navigator.userAgent, app = navigator.appVersion;
return { //移动终端浏览器版本信息
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部
};
}(),
language: (navigator.browserLanguage || navigator.language).toLowerCase()
}
function downApp(){
var urls = {
'android':'XXX.apk',
'ios':'XXX/id1438617787',
'other':'https://www.baidu.com/index.php?tn=monline_3_dg'
};
if (browser.versions.mobile) {//判断是否是移动设备打开。browser代码在下面
var ua = navigator.userAgent.toLowerCase();//获取判断用的对象
if (ua.match(/MicroMessenger/i) == "micromessenger") {
alert("点击右上角按钮，然后再弹出的菜单中，点击在浏览器中打开，即可安装");
}else if (browser.versions.ios) {
window.location.href=urls.ios;
}
else if(browser.versions.android){
window.location.href=urls.android;
}
} else {
window.location.href=urls.other;
}
}
</script>
</body>
</html>
