var webkitVer = parseInt(/WebKit\/([0-9]+)|$/.exec(navigator.appVersion)[1], 10); // also matches AppleWebKit
var isGoogle = webkitVer && navigator.vendor.indexOf('Google') === 0; // Also true for Opera Mobile and maybe others
var isAndroid = isGoogle && userAgent.indexOf('Android') > 0; // Careful - Firefox and Windows Mobile also have Android in user agent
var androidDesktopMode = !isAndroid && isGoogle && (navigator.platform.indexOf('Linux a') === 0) && 'ontouchstart' in document.documentElement;
let screenWidth = window.screen.width;
let isMobile = screenWidth <= 480;
let details = navigator.userAgent;
let regexp = /android|iphone|kindle|ipad/i;
let isMobileDevice = regexp.test(details);
if (isMobileDevice && isMobile) {
document.write("You are using a Mobile Device");
} else if (isMobile) {
document.write("You are using Desktop on Mobile"); // the most interesting
} else {
document.write("You are using Desktop");
}
5条答案
按热度按时间zy1mlcev1#
下面是iOS Safari用户的相关代码。本质上,User Agent在桌面模式下丢失了对iPhone/iPod/iPad的引用,但该信息仍然存在于navigator.platform中:
7gs2gvoe2#
在Android Chrome上,“桌面模式”会从用户代理中删除“Android”字符串。如果您可以使用JavaScript,以下 * 大多数 * 会检测Android Chrome桌面模式:
它假设带有ARM处理器的Chrome是Android。这个假设对于在ARM上运行Linux的用户来说肯定是失败的,对于在i686或MIPS等上运行Android的用户来说也是失败的(我还没有测试过ChromeOS)。
对于Windows移动的,您可以通过检查字符串“WPDesktop;“在用户代理中。
编辑:代码曾经使用
window.chrome
和window.chrome.webstore
,这是一个可靠的测试,但在Chrome 65左右,你不能再使用这些属性来检测桌面模式。感谢@faks提供的信息。编辑2:我现在强烈建议不要将“桌面模式”视为“移动的模式”,但以下是我的更新意见:
navigator.vendor.indexOf('Apple') === 0 && 'ontouchstart' in document.body
.我们需要这个来设置令人惊讶的糟糕的iOS inputMode正确的iPadOS 13(旧的导航器.平台技术现在打破了iOS 13测试版)和避免其他iOS可用性错误与其他输入类型.我认为你可以检查window.screen.width == 768
嗅探iPad(保持不变,即使方向改变).嗅探将打破,如果MacBook在触摸版出来.'ontouchstart' in document.body && navigator.platform.indexOf('Linux a') === 0 && (window.chrome || (window.Intl && Intl.v8BreakIterator))
.可怕的不可靠的嗅探,但我们真的需要它,因为Android的视口和捏缩放(不是页面缩放)是真的打破了Android上为我们的SPA(屏幕大小是不够的,因为桌面触摸用户可以使用一个小窗口)。mfuanj7w3#
如果检测操作系统/平台不是问题,那么你可以这样做。
可以有几个高端平板,宽度可达1280 px;
8yoxcaq74#
可以测试的代码:
a0x5cqrl5#
这可以通过将所使用的窗口宽度与实际屏幕宽度进行比较来完成:
返回true,如果
*桌面设备有浏览器窗口跨越多个屏幕
返回false,如果
*桌面设备有全屏浏览器窗口
*桌面设备有缩小浏览器窗口