¿Detecta usuarios de iPad que usan jQuery?

Question

¿Hay alguna manera de detectar si el usuario actual está usando un iPad usando jQuery/JavaScript?

Answer 1

Detección iPad

Usted debe ser capaz de detectar un usuario de iPad por echar un vistazo a la userAgent propiedad:

var is_iPad = navigator.userAgent.match(/iPad/i) != null; 

iPhone/Detección iPod

Del mismo modo, la platform propiedad para buscar dispositivos como iPhones o iPods:

function is_iPhone_or_iPod(){ 
    return navigator.platform.match(/i(Phone|Pod))/i) 
} 

Notas

Mientras que funciona, por lo general debe evitar realizar la detección específica del navegador, ya que a menudo puede ser poco fiable (y puede ser falsificada). Es preferible utilizar feature-detection real en la mayoría de los casos, lo que se puede hacer a través de una biblioteca como Modernizr.

Como se señala en Brennen's answer, pueden surgir problemas al realizar esta detección dentro de la aplicación de Facebook. Por favor, vea su respuesta para manejar este escenario.

Recursos relacionados

• jQuery HowTo: Detect iPad users using JavaScript
• jQuery HowTo: Detecting & Redirecting iPad/iPhone Users
• David Walsh's Blog : Detecting iPad use
• Detecting iPad use via PHP

Answer 2

Yo uso este:

function fnIsAppleMobile() 
{ 
    if (navigator && navigator.userAgent && navigator.userAgent != null) 
    { 
     var strUserAgent = navigator.userAgent.toLowerCase(); 
     var arrMatches = strUserAgent.match(/(iphone|ipod|ipad)/); 
     if (arrMatches != null) 
      return true; 
    } // End if (navigator && navigator.userAgent) 

    return false; 
} // End Function fnIsAppleMobile 


var bIsAppleMobile = fnIsAppleMobile(); // TODO: Write complaint to CrApple asking them why they don't update SquirrelFish with bugfixes, then remove 

Answer 3

Aunque el accepted solution es correcta para iPhones, se declare incorrectamente tanto isiPhone y isiPad para ser verdad para los usuarios que visitan su sitio en su iPad a partir de la aplicación de Facebook.

La sabiduría convencional es que los dispositivos iOS tienen un agente de usuario para Safari y un agente de usuario para UIWebView. Esta suposición es incorrecta ya que las aplicaciones iOS pueden personalizar su agente de usuario y lo hacen. El principal infractor aquí es Facebook.

comparar estas cadenas de agente de usuario para dispositivos iOS:

# iOS Safari 
iPad: Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B176 Safari/7534.48.3 
iPhone: Mozilla/5.0 (iPhone; CPU iPhone OS 5_0 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9A334 Safari/7534.48.3 

# UIWebView 
iPad: Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/98176 
iPhone: Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Mobile/8B117 

# Facebook UIWebView 
iPad: Mozilla/5.0 (iPad; U; CPU iPhone OS 5_1_1 like Mac OS X; en_US) AppleWebKit (KHTML, like Gecko) Mobile [FBAN/FBForIPhone;FBAV/4.1.1;FBBV/4110.0;FBDV/iPad2,1;FBMD/iPad;FBSN/iPhone OS;FBSV/5.1.1;FBSS/1; FBCR/;FBID/tablet;FBLC/en_US;FBSF/1.0] 
iPhone: Mozilla/5.0 (iPhone; U; CPU iPhone OS 5_1_1 like Mac OS X; ru_RU) AppleWebKit (KHTML, like Gecko) Mobile [FBAN/FBForIPhone;FBAV/4.1;FBBV/4100.0;FBDV/iPhone3,1;FBMD/iPhone;FBSN/iPhone OS;FBSV/5.1.1;FBSS/2; tablet;FBLC/en_US] 

Tenga en cuenta que en el IPAD, cadena de agente de usuario del Facebook UIWebView incluye 'iPhone'.

La vieja manera de identificar iPhone/iPad en JavaScript:

IS_IPAD = navigator.userAgent.match(/iPad/i) != null; 
IS_IPHONE = navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null); 

Si se va a ir con este enfoque para la detección de iPhone y iPad, que acabaría con IS_IPHONE y IS_IPAD tanto ser cierto si un usuario proviene de Facebook en un iPad. ¡Eso podría crear un comportamiento extraño!

La forma correcta para identificar iPhone/iPad en JavaScript:

IS_IPAD = navigator.userAgent.match(/iPad/i) != null; 
IS_IPHONE = (navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null); 
if (IS_IPAD) { 
    IS_IPHONE = false; 
} 

Declaramos IS_IPHONE ser falsa en iPads para cubrir por el agente de usuario extraña Facebook UIWebView IPAD. Este es un ejemplo de cómo el rastreo de agente de usuario no es confiable. Cuantas más aplicaciones de iOS personalicen su agente de usuario, más problemas tendrá la detección de agente de usuario. Si puede evitar el rastreo de agente de usuario (sugerencia: Consultas de medios de CSS), HÁGALO.

Answer 4

Yo uso este:

//http://detectmobilebrowsers.com/ + tablets 
(function(a) { 
    if(/android|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(ad|hone|od)|iris|kindle|lge |maemo|meego.+mobile|midp|mmp|netfront|opera m(ob|in)i|palm(os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino|playbook|silk/i.test(a) 
    || 
    /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s)|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp(i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac(|\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt(|\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg(g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v)|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v)|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-|)|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) 
    { 
     window.location="yourNewIndex.html" 
    } 
})(navigator.userAgent||navigator.vendor||window.opera); 

Answer 5

No hay necesidad de jQuery aquí. Usar el agente de usuario para determinar la plataforma en la que se está ejecutando es el enfoque clásico. No es tan simple como parece, ya se ha mencionado que hay muchos casos extremos en los que puede tropezar.

Escribí este is-mobile component que puede detectar si también se está ejecutando en un iPad, iPhone y otras plataformas, y tiene en cuenta los diversos casos extremos.

dude en para importar y utilizar como se muestra en estos ejemplos:

isMobile.iPad() => true/false 
isMobile.iPhone() => true/false 
isMobile.iOS() => true/false 
isMobile.Android() => true/false 
isMobile.any() => true/false