Как определить, является ли ваше устройство iPad3 или 4 с использованием jQuery или javascript?

Question

Я искал несколько способов обнаружить устройства iPad3 и iPad4. Я динамически добавляю метапорт. Я хотел увидеть настольную версию и удалить область просмотра в Desktop, iPad3 и iPad4, но в мобильном, конечно, добавить область просмотра, чтобы увидеть мобильную версию.

Пожалуйста, проверьте мою функцию инициализации в var ApplyViewPort:

var deviceDetection = function () { 
var osVersion, 
device, 
deviceType, 
userAgent, 
isSmartphoneOrTablet; 

device = (navigator.userAgent).match(/Android|iPhone|iPad|iPod/i); 

if ( /Android/i.test(device) ) { 
    if ( !/mobile/i.test(navigator.userAgent) ) { 
        deviceType = 'tablet'; 
    } else { 
        deviceType = 'phone'; 
    } 

    osVersion = (navigator.userAgent).match(/Android\s+([\d\.]+)/i); 
    osVersion = osVersion[0]; 
    osVersion = osVersion.replace('Android ', ''); 

} else if ( /iPhone/i.test(device) ) { 
    deviceType = 'phone'; 
    osVersion = (navigator.userAgent).match(/OS\s+([\d\_]+)/i); 
    osVersion = osVersion[0]; 
    osVersion = osVersion.replace(/_/g, '.'); 
    osVersion = osVersion.replace('OS ', ''); 

} else if ( /iPad/i.test(device) ) { 
    deviceType = 'tablet';
    osVersion = (navigator.userAgent).match(/OS\s+([\d\_]+)/i); 
    osVersion = osVersion[0]; 
    osVersion = osVersion.replace(/_/g, '.'); 
    osVersion = osVersion.replace('OS ', ''); 
}

isSmartphoneOrTablet = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent); 
userAgent = navigator.userAgent; 

return { 'isSmartphoneOrTablet': isSmartphoneOrTablet, 
         'device': device, 
         'osVersion': osVersion, 
         'userAgent': userAgent, 
         'deviceType': deviceType
        }; 
}();

var ApplyViewPort = {

    init: function() {
        this.metaView   = '<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />';
        /// Preppend a meta viewport if it's not yet preppended
        /// Else remove the meta viewport
        if (deviceDetection.deviceType == 'tablet') {
            $('meta[name="viewport"]').remove();

            if (window.devicePixelRatio == 2) {
                $('meta[name="viewport"]').remove();
            }

        } else {
            $('head').append(this.metaView);
        }

    }
}

$(document).ready(function() {
    ApplyViewPort.init();

});

Answer 1

Определить между iPad 1 и 2 шага:

1. Проверьте строку UA для iPad
2. Проверьте гироскоп

Определить между iPad 2 и 3 шага:

1. Проверьте строку UA для iPad
2. Проверьте плотность пикселей (Retina iPad 3 показывает = 2)

Определить между iPad 3 и 4 шага:

1. Проверьте строку UA для iPad
2. Проверьте плотность пикселей (Retina Displays = 2)
3. Проверьте максимальную анизотропию устройств (iPad 3 = 2, iPad 4 = 16)

Максимальная анизотропия 16 обычно указывает на современное устройство с достойной графической производительностью.

var gl;
var iPadVersion = false;

window.ondevicemotion = function(event) {
  if (!iPadVersion && navigator.platform.indexOf("iPad") != -1) {
    iPadVersion = 1;
    if (event.acceleration) iPadVersion = window.devicePixelRatio;
  }
  window.ondevicemotion = null;
}

function initWebGL(canvas) {
  gl = null;

  try {
    gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
  }
  catch(e) {}

  if (!gl) {
    gl = null;
  }

  return gl;
}

function checkMaxAnisotropy() {
  var max = 0;

  var canvas = document.getElementById('webGLCanvasTest');
  gl = initWebGL(canvas);

  try {
    gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
  }
  catch(e) {}

  if (gl) {
    var ext = (
      gl.getExtension('EXT_texture_filter_anisotropic') ||
      gl.getExtension('MOZ_EXT_texture_filter_anisotropic') ||
      gl.getExtension('WEBKIT_EXT_texture_filter_anisotropic')
    );

    if (ext){
      max = gl.getParameter(ext.MAX_TEXTURE_MAX_ANISOTROPY_EXT);
    }
  }
  return max;
}

function isiPad( $window ) {
  var ua = $window.navigator.userAgent || $window.navigator.vendor || $window.opera;
  return (/iPad/).test(ua);
}


function getiPadVersion( $window ) {
  if(isiPad(window) && window.devicePixelRatio === 2) {
    if(checkMaxAnisotropy() < 4) {
      iPadVersion = 3;
    } else {
      iPadVersion = 4;
    }
  }
  return iPadVersion;
}


/* BONUS CODE 
   isSmartDevice() - Detect most mobile devices
   isOldDevice() - Detect older devices that have poor video card performance
*/

function isSmartDevice( $window ) {
  var ua = $window.navigator.userAgent || $window.navigator.vendor || $window.opera;
  return (/iPhone|iPod|iPad|Silk|Android|BlackBerry|Opera Mini|IEMobile/).test(ua);
}

function isOldDevice() {
  if(isSmartDevice(window) && window.devicePixelRatio === 1 && checkMaxAnisotropy() < 4 || isiPad( window ) && checkMaxAnisotropy() < 4) {
    return true;
  } else {
    return false;
  }
}


alert('iPad Version: ' + getiPadVersion(window) );

#webGLCanvasTest {
  width: 1px;
  height: 1px;
  position: fixed;
  top: -1px;
  left: -1px;
}

<!-- Device Testing Canvas, Hide This Somewhere -->
<canvas id="webGLCanvasTest"></canvas>

Answer 2

http://docs.phonegap.com/en/3.0.0rc1/cordova_device_device.md.html попробуйте это с device.model; которая даст вам точную версию ipad, но вам нужно использовать только более высокую версию phonegap