我正在寻找一个函数,返回一个布尔值,如果用户正在使用移动浏览器与否。
我知道我可以使用导航器。userAgent并使用regex编写该函数,但是用户代理对于不同的平台来说太复杂了。我怀疑匹配所有可能的设备是否容易,我认为这个问题已经解决了很多次,所以应该有某种完整的解决方案来完成这样的任务。
我正在看这个网站,但不幸的是,脚本是如此神秘,我不知道如何使用它为我的目的,这是创建一个返回true/false的函数。
我正在寻找一个函数,返回一个布尔值,如果用户正在使用移动浏览器与否。
我知道我可以使用导航器。userAgent并使用regex编写该函数,但是用户代理对于不同的平台来说太复杂了。我怀疑匹配所有可能的设备是否容易,我认为这个问题已经解决了很多次,所以应该有某种完整的解决方案来完成这样的任务。
我正在看这个网站,但不幸的是,脚本是如此神秘,我不知道如何使用它为我的目的,这是创建一个返回true/false的函数。
当前回答
使用window.screen怎么样?宽度”?
if (window.screen.width < 800) {
// do something
}
or
if($(window).width() < 800) {
//do something
}
我想这是最好的方法,因为每天都有新的移动设备!
(虽然我认为旧的浏览器不支持它,但试试看吧:))
其他回答
像这样的怎么样?
if(
(screen.width <= 640) ||
(window.matchMedia &&
window.matchMedia('only screen and (max-width: 640px)').matches
)
){
// Do the mobile thing
}
如何:
if (typeof screen.orientation !== 'undefined') { ... }
...因为智能手机通常支持这个属性,而桌面浏览器不支持。在MDN中见。
编辑1:正如@Gajus指出的,窗口。Orientation现在已弃用,不应该使用。
编辑2:您可以使用实验屏幕。Orientation而不是弃用的window.orientation。在MDN中见。
编辑3:从窗口更改。朝向屏幕。朝向
UserAgent不是100%可靠的。
window.navigator.maxTouchPoints > 1;
这就够了!它排除了浏览器开发控制台中的电话模拟器。这对我来说很重要。
有一个简单的技巧来检测它是否是一个移动设备。检查ontouchstart事件是否存在:
function isMobile()
{
return "ontouchstart" in window;
}
我遇到过一些情况,上面的答案对我不起作用。所以我想到了这个。可能对某人有帮助。
if(/iPhone|iPad|iPod|Android|webOS|BlackBerry|Windows Phone/i.test(navigator.userAgent)
|| screen.availWidth < 480){
//code for mobile
}
这取决于您的用例。如果你专注于屏幕使用屏幕。availWidth,或者你可以使用document.body. clientwidth如果你想基于document进行渲染。