Qual é a melhor maneira de detectar um dispositivo móvel em jQuery?

Também pode usar o programa do lado do servidor e definir variáveis de javascript a partir dele.

Exemplo em php

Telecarregamento http://code.google.com/p/php-mobile-detect/ e depois definir variáveis de javascript.

<script>
//set defaults
var device_type = 'desktop';
</script>

<?php
require_once( 'Mobile_Detect.php');
$detect = new Mobile_Detect();
?>

<script>
device_type="<?php echo ($detect->isMobile() ? ($detect->isTablet() ? 'tablet' : 'mobile') : 'desktop'); ?>";
alert( device_type);
</script>

Tentei algumas das maneiras {[[6]} e depois decidi preencher uma lista manualmente e fazer uma simples verificação JS. E no final o usuário tem que confirmar. Porque alguns cheques deram falso positivo ou negativo.

var isMobile = false;
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Opera Mobile|Kindle|Windows Phone|PSP|AvantGo|Atomic Web Browser|Blazer|Chrome Mobile|Dolphin|Dolfin|Doris|GO Browser|Jasmine|MicroB|Mobile Firefox|Mobile Safari|Mobile Silk|Motorola Internet Browser|NetFront|NineSky|Nokia Web Browser|Obigo|Openwave Mobile Browser|Palm Pre web browser|Polaris|PS Vita browser|Puffin|QQbrowser|SEMC Browser|Skyfire|Tear|TeaShark|UC Browser|uZard Web|wOSBrowser|Yandex.Browser mobile/i.test(navigator.userAgent) && confirm('Are you on a mobile device?')) isMobile = true;

Agora, se quiser usar o jQuery para definir o CSS, pode fazer o seguinte:

$(document).ready(function() {
  if (isMobile) $('link[type="text/css"]').attr('href', '/mobile.css');
});

Uma vez que as fronteiras entre dispositivos móveis e fixos se tornam fluentes e os navegadores móveis já são poderosos, verificar a largura e a confirmação do utilizador será provavelmente o melhor para a futuro (assumindo que a largura em alguns casos ainda será importante). Porque os toques já são convertidos em mouse-ups e downs.

if(typeof window.orientation !== 'undefined'){...}

function isDeviceMobile(){
 var isMobile = {
  Android: function() {
      return navigator.userAgent.match(/Android/i) && navigator.userAgent.match(/mobile|Mobile/i);
  },
  BlackBerry: function() {
      return navigator.userAgent.match(/BlackBerry/i)|| navigator.userAgent.match(/BB10; Touch/);
  },
  iOS: function() {
      return navigator.userAgent.match(/iPhone|iPod/i);
  },
  Opera: function() {
      return navigator.userAgent.match(/Opera Mini/i);
  },
  Windows: function() {
      return navigator.userAgent.match(/IEMobile/i) || navigator.userAgent.match(/webOS/i) ;
  },
  any: function() {
      return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
  }
};      
 return isMobile.any()
}

Eu uso este

if(navigator.userAgent.search("mobile")>0 ){
         do something here
}

function isMobile() {
 try {
    if(/Android|webOS|iPhone|iPad|iPod|pocket|psp|kindle|avantgo|blazer|midori|Tablet|Palm|maemo|plucker|phone|BlackBerry|symbian|IEMobile|mobile|ZuneWP7|Windows Phone|Opera Mini/i.test(navigator.userAgent)) {
     return true;
    };
    return false;
 } catch(e){ console.log("Error in isMobile"); return false; }
}

Check-out http://detectmobilebrowsers.com/ que lhe fornece um programa para detectar dispositivos móveis em várias línguas, incluindo

JavaScript, jQuery, PHP, JSP, Perl, Python, ASP, C#, ColdFusion e muitos mais

Você pode usar a consulta de mídia para ser capaz de lidar com isso facilmente.

isMobile = function(){
    var isMobile = window.matchMedia("only screen and (max-width: 760px)");
    return isMobile.matches ? true : false
}

var device = {
  detect: function(key) {
    if(this['_'+key] === undefined) {
      this['_'+key] = navigator.userAgent.match(new RegExp(key, 'i'));
    }
    return this['_'+key];
  },
  iDevice: function() {
    return this.detect('iPhone') || this.detect('iPod');
  },
  android: function() {
    return this.detect('Android');
  },
  webOS: function() {
    return this.detect('webOS');
  },
  mobile: function() {
    return this.iDevice() || this.android() || this.webOS();
  }
};

Https://github.com/matthewhudson/device.js

Http://www.w3schools.com/jsref/prop_nav_useragent.asp

Filtro pelo nome da plataforma.

Ex:

x = $( window ).width();

platform = navigator.platform;

alert(platform);

if ( (platform != Ipad) || (x < 768) )  {


} 

^^

Se por um dispositivo móvel você entender um sensível ao toque, então você pode determiná-lo verificando a existência de manipuladores do toque:

let deviceType = (('ontouchstart' in window)
                 || (navigator.maxTouchPoints > 0)
                 || (navigator.msMaxTouchPoints > 0)
                 ) ? 'touchable' : 'desktop';

Também eu recomendo usar o pequeno JavaScript library Bowser, yes no R. é baseado no navigator.userAgent e bastante bem testado para todos os navegadores, incluindo iPhone, Android etc.

Https://github.com/ded/bowser

Pode usar simplesmente dizer:

if (bowser.msie && bowser.version <= 6) {
  alert('Hello China');
} else if (bowser.firefox){
  alert('Hello Foxy');
} else if (bowser.chrome){
  alert('Hello Silicon Valley');
} else if (bowser.safari){
  alert('Hello Apple Fan');
} else if(bowser.iphone || bowser.android){
  alert('Hello mobile');
}

Adicionar:

Em algumas versões de iOS 9.x , Safari não apresenta o "iPhone" em navigator.userAgent, mas mostra-o em navigator.platform.

var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);
    if(!isMobile){
        isMobile=/iPhone|iPad|iPod/i.test(navigator.platform);
    }

Conheço esta velha pergunta e há muita resposta, mas acho que esta função é simples e vai ajudar a detectar todos os dispositivos móveis, Tablet e navegador de computador que funciona como um encanto.

function Device_Type() 
{
    var Return_Device; 
    if(/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|android|iemobile|w3c|acs\-|alav|alca|amoi|audi|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd\-|dang|doco|eric|hipt|inno|ipaq|java|jigs|kddi|keji|leno|lg\-c|lg\-d|lg\-g|lge\-|maui|maxo|midp|mits|mmef|mobi|mot\-|moto|mwbp|nec\-|newt|noki|palm|pana|pant|phil|play|port|prox|qwap|sage|sams|sany|sch\-|sec\-|send|seri|sgh\-|shar|sie\-|siem|smal|smar|sony|sph\-|symb|t\-mo|teli|tim\-|tosh|tsm\-|upg1|upsi|vk\-v|voda|wap\-|wapa|wapi|wapp|wapr|webc|winw|winw|xda|xda\-) /i.test(navigator.userAgent))
    {
        if(/(tablet|ipad|playbook)|(android(?!.*(mobi|opera mini)))/i.test(navigator.userAgent)) 
        {
            Return_Device = 'Tablet';
        }
        else
        {
            Return_Device = 'Mobile';
        }
    }
    else if(/(tablet|ipad|playbook)|(android(?!.*(mobi|opera mini)))/i.test(navigator.userAgent)) 
    {
        Return_Device = 'Tablet';
    }
    else
    {
        Return_Device = 'Desktop';
    }

    return Return_Device;
}

Aqui está mais uma sugestão implementada com JavaScript puro (es6)

const detectDeviceType = () =>
    /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
        ? 'Mobile'
        : 'Desktop';

detectDeviceType();

function ismobile(){
   if(/android|webos|iphone|ipad|ipod|blackberry|opera mini|Windows Phone|iemobile|WPDesktop|XBLWP7/i.test(navigator.userAgent.toLowerCase())) {
       return true;
   }
   else
    return false;
}

Dependendo do que você quer detectar móvel (o que significa que esta sugestão não vai atender às necessidades de todos), você pode ser capaz de conseguir uma distinção olhando para a diferença de milisegundo onmouseenter-to-onclick, como eu descrevi em esta resposta.

@{
    var isMobileDevice = HttpContext.Current.Request.Browser.IsMobileDevice;
}

<html lang="en" class="@((isMobileDevice)?"ismobiledevice":"")">

Então para verificar em qualquer página do seu site (jQuery):

<script>
var isMobile = $('html').hasClass('ismobiledevice');
</script>

Utilize este

if( screen.width <= 480 ) { 
    // is mobile 
}

Se quiser testar o agente do utilizador, a forma correcta é testar o agente do utilizador, ou seja, testar {[[0]}.

Se o user for falso isto, não lhes interessa. Se você test.isUnix() Você não deve posteriormente ter que se preocupar se o sistema é Unix.

Como um usuário mudando userAgent também é bom, mas você não espera que os sites rendam corretamente se você fizer.

Se você deseja fornecer suporte para navegadores Microsoft você deve garantir que os primeiros caracteres do conteúdo inclui e testa todas as páginas que escreveres.