javascript - 如何检测手机和平板分离的所有手持设备？

Question

我目前可以检测到所有手持设备，但无法将平板电脑和移动设备检测分开。我搜索了很多资源和问答，但找不到解决方案。

由于$.browser方法从jQuery 1.9.1中删除。我们必须用原生 js 来做。

这是测试jsFiddle。

javascript:

/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ? isTabletMobile = true : isTabletMobile = false;
//this works perfect

//problem starts when i try to detect difference between mobile and tablet

/iPad/i.test(navigator.userAgent) ? isTablet = true : isTablet = false;
//can't detect other tablet devices

/Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ? isMobile = true : isMobile = false;
//can't exclude tablet devices from here (like Android tablet devices)

if ( isTabletMobile  ) {
    alert('You are on Mobile or Tablet');
}else{
    alert('You are on Destop device');
}

if ( isTablet ) {
    alert('You are on Tablet');
}
if ( isMobile ) {
    alert('You are on Mobile');
}

资源

Answer 1

你应该检查屏幕尺寸。

尝试对大多数最小尺寸的平板电脑进行一些研究。

那么如果您检查的设备尺寸大于或等于平板电脑的最小尺寸，则表示该设备是平板电脑。

var isDevice = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ? true : false;

var tabletMinWidth,
    tabletMinHeight;

if(isDevice){
   if(tabletMinWidth <= deviceWidth && tabletMinHeight <= deviceHeigth){
      isTablet = true
   }
}