如何检测桌面和移动Chrome用户代理?

时间:2014-08-19 22:15:24

标签: javascript google-chrome browser-detection

对于Chrome桌面扩展主页,我尝试检测用户是否在Android上使用Chrome for Desktop或Chrome for Mobile。目前,下面的脚本将Android Chrome与Desktop chrome相同。在桌面Chrome上,它应该显示" chrome"链接;但是,如果有人在Chrome for Android上,那么 应该显示" mobile-other"链接。

脚本:

<script>$(document).ready(function(){
    var ua = navigator.userAgent;
    if (/Chrome/i.test(ua))
       $('a.chrome').show();

    else if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile/i.test(ua))
       $('a.mobile-other').show();

    else
       $('a.desktop-other').show();
  });</script>

Chrome Android用户代理:

Mozilla/5.0 (Linux; <Android Version>; <Build Tag etc.>) AppleWebKit/<WebKit Rev> (KHTML, like Gecko) Chrome/<Chrome Rev> Mobile Safari/<WebKit Rev>

2 个答案:

答案 0 :(得分:24)

问题是用户代理将始终拥有“Chrome”,无论是桌面版还是移动版。所以你必须先检查更具体的案例。

$(document).ready(function(){
    var ua = navigator.userAgent;

    if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua))
       $('a.mobile-other').show();

    else if(/Chrome/i.test(ua))
       $('a.chrome').show();

    else
       $('a.desktop-other').show();
});

答案 1 :(得分:2)

根据最新的Chrome for iOS用户代理字符串更新@ imtheman的代码:

$(document).ready(function(){
var ua = navigator.userAgent;

if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua))
   $('a.mobile-other').show();

else if (/Chrome/i.test(ua))
   $('a.chrome').show();

else
   $('a.desktop-other').show();
});