【问题标题】:Detect Android phone via Javascript / jQuery通过 Javascript / jQuery 检测 Android 手机
【发布时间】:2011-08-27 05:56:49
【问题描述】:

我如何检测到正在使用的设备是用于移动网站的 Android 设备?

我需要将某些 css 属性应用到 Android 平台。

谢谢

【问题讨论】:

    标签: javascript jquery android


    【解决方案1】:

    看看那个:http://davidwalsh.name/detect-android

    JavaScript:

    var ua = navigator.userAgent.toLowerCase();
    var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");
    if(isAndroid) {
      // Do something!
      // Redirect to Android-site?
      window.location = 'http://android.davidwalsh.name';
    }
    

    PHP:

    $ua = strtolower($_SERVER['HTTP_USER_AGENT']);
    if(stripos($ua,'android') !== false) { // && stripos($ua,'mobile') !== false) {
      header('Location: http://android.davidwalsh.name');
      exit();
    }
    

    编辑 :正如某些 cmets 所指出的,这将适用于 99% 的情况,但未涵盖某些边缘情况。如果你在 JS 中需要更高级和防弹的解决方案,你应该使用 platform.js :https://github.com/bestiejs/platform.js

    【讨论】:

    • 别忘了检查安卓平板电脑:googlewebmastercentral.blogspot.com/2011/03/…
    • 值得注意的是,这并不总是适用于安卓设备,例如,Kindle Fire HD 设备报告的用户代理根本不包含“android”这个词。
    • navigator.userAgent 方法不适用于三星 Galaxy 设备。浏览器规范中没有“Android”。
    • JS方案的前两行可以简化为:var isAndroid = /Android/i.test(navigator.userAgent)
    • 您的解决方案不起作用。这是一个诺基亚 Lumia 用户代理。你猜怎么着?它与 android 匹配:Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 625; Orange) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537
    【解决方案2】:

    这个单线怎么样?

    var isAndroid = /(android)/i.test(navigator.userAgent);
    

    i 修饰符用于执行不区分大小写的匹配。


    技术取自 Cordova AdMob 测试项目:https://github.com/floatinghotpot/cordova-admob-pro/wiki/00.-How-To-Use-with-PhoneGap-Build

    【讨论】:

    • 这里的括号可以省略,因为你不需要“捕获”结果,所以它就变成了:/android/i
    【解决方案3】:

    我认为 Michal 的答案是最好的,但我们可以更进一步,按照原始问题动态加载 Android CSS:

    var isAndroid = /(android)/i.test(navigator.userAgent);
    if (isAndroid) {
        var css = document.createElement("link");
        css.setAttribute("rel", "stylesheet");
        css.setAttribute("type", "text/css");
        css.setAttribute("href", "/css/android.css");
        document.body.appendChild(css);
    }
    

    【讨论】:

    • 您为什么要这样做,而您可以使用媒体查询? JS 设备检测应该仅用于增强功能,例如添加安装应用的邀请。页面渲染永远不应该依赖它,因为你会遇到性能问题和糟糕的可用性体验。
    • @camilokawerin 您的回复应直接发送给作者。我只是在回答他的问题。在某些情况下,您需要特定于平台的 CSS。例如,如果您希望界面的视觉风格与设备相匹配。
    【解决方案4】:
    ;(function() {
        var redirect = false
        if (navigator.userAgent.match(/iPhone/i)) {
            redirect = true
        }
        if (navigator.userAgent.match(/iPod/i)) {
            redirect = true
        }
        var isAndroid = /(android)/i.test(navigator.userAgent)
        var isMobile = /(mobile)/i.test(navigator.userAgent)
        if (isAndroid && isMobile) {
            redirect = true
        }
        if (redirect) {
            window.location.replace('jQueryMobileSite')
        }
    })()
    

    【讨论】:

      【解决方案5】:

      js 版本,也支持 iPad:

      var is_mobile = /mobile|android/i.test (navigator.userAgent);
      

      【讨论】:

      • 不起作用,因为它可以捕获许多设备,而不仅仅是问题要求的 Android。
      • 至少使用这样的东西:/android.*(?=mobile)/i.test(navigator.userAgent);检测Android手机。但是这个正则表达式包含“昂贵”的量词,所以菲利普用 2 个单独的测试的答案可能更合适。
      猜你喜欢
      • 2012-05-27
      • 1970-01-01
      • 2013-07-17
      • 2011-01-16
      • 2012-04-07
      • 2020-10-07
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多