js点击下载跳转iOS或安卓

在移动wap上,最常见的就是引流用户下载安装自己的应用程序,如何通过js点击判断下载是iOS还是安卓呢?其实很简单,就是要判断用户的设备是iOS还是Android,然后分别跳转就可以了。

之前写过的一个代码:判断iOS或安卓

<script type="text/javascript">
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
alert('是否是Android:'+isAndroid);
alert('是否是iOS:'+isiOS);
</script>

有了这个判断,就可以根据对应的平台来进行操作。

1.安卓的,就直接下载app,或者跳到安卓应用市场下载

2.iOS的,直接跳到苹果商店的应用页进行下载

3.其它平台,跳到自定义的页面,比如一个放有多个平台的下载页。

function downApp(){
	var u = navigator.userAgent, 
	isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1,
	isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
	urls = {
		'android':'http://ftp-apk.pcauto.com.cn/pub/autoclub-5000-autowapDL1.apk',
		'ios':'https://itunes.apple.com/cn/app/zhong-guo-che-you-hui/id640447959',
		'other':'http://www1.pcauto.com.cn/app/20141120/pcautoapp/index.html'
	};
	//三元运算
	// window.location.href = isAndroid? urls.android : isiOS? urls.ios : urls.other;
	//简化
	if(isAndroid){
		window.location.href=urls.android;
	}else if(isiOS){
		window.location.href=urls.ios;
	}else{
		window.location.href=urls.other;
	}
}
downApp();

你可以直接把这个函数放在一个按钮或者链接上,点击触发这个事件。就能实现js点击跳转到适合手机的设备了。

例如:

<a href="javascript:void(0)" onclick="downApp()">点击下载应用</a>

记得修改一下上面应用的链接地址,设置对应的路径。

打开手机点击下面这个按钮试试效果,在PC上点击会跳到一个下载汇总页面。

点击下载太平洋车友应用


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流