前段时间，小颖公司需要实现：用户在微信中打开一个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)" 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>

js判断客户端是iOS还是Android移动终端的更多相关文章

  1. 判断客户端是IOS还是Android

    PHP 判断客户端是IOS还是Android <?php if(strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone')||strpos($_SERVER['H ...

  2. ASP.NET MVC Filters 4种默认过滤器的使用【附示例】 数据库常见死锁原因及处理 .NET源码中的链表 多线程下C#如何保证线程安全? .net实现支付宝在线支付 彻头彻尾理解单例模式与多线程 App.Config详解及读写操作 判断客户端是iOS还是Android，判断是不是在微信浏览器打开

    ASP.NET MVC Filters 4种默认过滤器的使用[附示例]   过滤器(Filters)的出现使得我们可以在ASP.NET MVC程序里更好的控制浏览器请求过来的URL,不是每个请求都会响 ...

  3. js如何判断客户端是iOS还是Android等移动终端

    判断原理:JavaScript是前端开发的主要语言,我们可以通过编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性来 ...

  4. JS判断是否是ioS或者Android

    每个客户端都带有自身的UA标识,通过JavaScript,可以获取客户端标识,我们可以获取浏览器的userAgent,用正则来判断手机是ios(苹果)还是Android(安卓)客户端. 项目实例:ht ...

  5. PHP 判断客户端是IOS还是Android

    <?php if(strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone')||strpos($_SERVER['HTTP_USER_AGENT'], 'iPad ...

  6. 判断客户端是iOS还是Android，判断是不是在微信浏览器打开

    bool flag = false; string agent = System.Web.HttpContext.Current.Request.UserAgent.ToLower(); string ...

  7. JS判断客户端是否是iOS或者Android或者ipad（二）

    js判断客户端是IPAD和iphone 多了就不说了,直接上代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22     funct ...

  8. H5案例分享：使用JS判断客户端、浏览器、操作系统类型

    使用JS判断客户端.浏览器.操作系统类型 一.JS判断客户端类型 JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Androi ...

  9. JS判断客户端、浏览器、操作系统

    一.JS判断客户端是否是iOS或者Android手机移动端 通过判断浏览器的userAgent,用正则来判断手机是否是ios和Android客户端. 方法一: var u = navigator.us ...

随机推荐

  1. 从URL重写中学习正则表达式

    起因: 最近因为业务上的需求,老板要求改写网站的域名.要求把所有的二级域名中的内容放到主域名下,增加资源集中程度,有利于搜索引擎的优化. so.网站中所有的URL定向都要重写,也就是我们所说的伪静态的 ...

  2. 集合类源码（二）Collection之List（ArrayList, LinkedList, Vector）

    ArrayList 功能 完全命名 public class ArrayList<E> extends AbstractList<E> implements List<E ...

  3. docke通信之Linux 网络命名空间

    一.前言 namespace(命名空间)和cgroup是软件容器化(想想Docker)趋势中的两个主要内核技术.简单来说,cgroup是一种对进程进行统一的资源监控和限制,它控制着你可以使用多少系统资 ...

  4. 2019-11-29-WPF-非客户区的触摸和鼠标点击响应

    原文:2019-11-29-WPF-非客户区的触摸和鼠标点击响应 title author date CreateTime categories WPF 非客户区的触摸和鼠标点击响应 lindexi ...

  5. hadoop格式化：java.io.IOException: Incompatible clusterIDs in /home/lxh/hadoop/hdfs/data: namenode clusterID

    1 概述  解决hadoop启动hdfs时,datanode无法启动的问题.错误为: java.io.IOException: Incompatible clusterIDs in /home/lxh ...

  6. MarkDown 常用语法规则

    > # 标题 # 标题1:h1的效果 ## 标题2:h2的效果 ### 标题3:h3的效果 #### 标题4:h4的效果 ##### 标题5:h5的效果 ###### 标题6:h6的效果 ### ...

  7. ORA-03113: 通信通道的文件结束解决方法一例

    开发项目时,使用的是Oracle数据库.最近遇到了“ORA-03113: 通信通道的文件结束”错误.如下图所示: 经过网上查资料和请教同事,终于找到了解决ORA-03113错误的办法. 解决步骤如下: ...

  8. Mark: 如何用Haskell写一个简单的编译器

    作者:aaaron7 链接:https://www.zhihu.com/question/36756224/answer/88530013 如果是用 Haskell 的话,三篇文章足矣. prereq ...

  9. MyBatis启动之XMLConfigBuilder解析配置文件（二）

    前言 XMLConfigBuilder 是BaseBuilder(解析中会涉及到讲解)的其中一个子类,它的作用是把MyBatis的XML及相关配置解析出来,然后保存到Configuration中.本文 ...

  10. delphi实现窗体闪烁功能

    delphi实现窗体闪烁功能 以前做窗口闪动时都没有考虑到让任务栏上的按钮闪动的问题, 现在一个客户需要任务栏按钮闪动,发现以前使用的flashwindow不能达到要求了, 查找了一下,找到flash ...