zoukankan      html  css  js  c++  java
  • 点击后辨别当前设备,并进行相应的操作(跳转、提示等)

    HTML代码:

    <button id="link_sel">点我吧</button>

    JS代码:

    <script type="text/javascript">
        /*辨别当前设备是iphone还是Android*/
        var browser = {
            versions: function () {
                var u = navigator.userAgent, app = navigator.appVersion;
                return { //移动终端浏览器版本信息
                    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
                };
            }()
        }
    /*辨别完设备后进行相应的跳转*/ 
        $(function(){
            /*点击后触发*/
            $("#link_sel").click(function(){
                /*ios,ipad设备下打开时的情况*/
                if (browser.versions.iPhone || browser.versions.iPad || browser.versions.ios) {
                    window.location.href = "你的链接";
                }
                /*Android设备下打开时的情况*/
                else if (browser.versions.android) {
                    window.location.href = "你的链接";
                }
                /*PC端打开时的情况*/
                else{
                    alert("请更换移动设备后重试!")
                }
    
            });
        });
    </script>
    /*第二种方法
    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终端
    */
  • 相关阅读:
    Markdown语法帮助文档
    react-native-vector-icons使用方法
    如何创建Pull Request,以开源项目ant design pro为例
    4.环境变量总结篇
    3.Flutter之hello_world
    构建之法 阅读笔记03
    学习进度14
    团队项目-个人博客6.5
    团队项目-个人博客6.4
    构建之法 阅读笔记02
  • 原文地址:https://www.cnblogs.com/heyiming/p/6866615.html
Copyright © 2011-2022 走看看