我正在寻找一个函数，返回一个布尔值，如果用户正在使用移动浏览器与否。
我知道我可以使用导航器。userAgent并使用regex编写该函数，但是用户代理对于不同的平台来说太复杂了。我怀疑匹配所有可能的设备是否容易，我认为这个问题已经解决了很多次，所以应该有某种完整的解决方案来完成这样的任务。
我正在看这个网站，但不幸的是，脚本是如此神秘，我不知道如何使用它为我的目的，这是创建一个返回true/false的函数。
当前回答
这里有一个简单的解决方案，来自facebook的弹弓
const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
if (isMobile) {
/* your code here */
}
其他回答
有一个简单的技巧来检测它是否是一个移动设备。检查ontouchstart事件是否存在:
function isMobile()
{
return "ontouchstart" in window;
}
我通常发现，检查只在移动视图中可见的特定元素(比如汉堡图标)的可见性这一更简单的方法效果很好，而且比依赖非常复杂的正则表达式安全得多。这将很难测试100%的工作。
function isHidden(el) {
return (el.offsetParent === null);
}
//true / false
function isMobile()
{
return (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) );
}
您还可以按照本教程来检测特定的手机。请点击这里。
最好的一定是:
var isMobile = (/Mobile/i.test(navigator.userAgent));
但是就像Yoav Barnea说的…
// Seem legit
var isMobile = ('DeviceOrientationEvent' in window || 'orientation' in window);
// But with my Chrome on windows, DeviceOrientationEvent == fct()
if (/Windows NT|Macintosh|Mac OS X|Linux/i.test(navigator.userAgent)) isMobile = false;
// My android have "linux" too
if (/Mobile/i.test(navigator.userAgent)) isMobile = true;
在这3个测试之后，我希望var isMobile是…好吧
没有完美的解决方案来检测JS代码是否在移动浏览器上执行，但以下两个选项应该在大多数情况下都有效。
选项1:浏览器嗅探
!function(a){var b=/iPhone/i,c=/iPod/i,d=/iPad/i,e=/(?=.*\bAndroid\b)(?=.*\bMobile\b)/i,f=/Android/i,g=/(?=.*\bAndroid\b)(?=.*\bSD4930UR\b)/i,h=/(?=.*\bAndroid\b)(?=.*\b(?:KFOT|KFTT|KFJWI|KFJWA|KFSOWI|KFTHWI|KFTHWA|KFAPWI|KFAPWA|KFARWI|KFASWI|KFSAWI|KFSAWA)\b)/i,i=/IEMobile/i,j=/(?=.*\bWindows\b)(?=.*\bARM\b)/i,k=/BlackBerry/i,l=/BB10/i,m=/Opera Mini/i,n=/(CriOS|Chrome)(?=.*\bMobile\b)/i,o=/(?=.*\bFirefox\b)(?=.*\bMobile\b)/i,p=new RegExp("(?:Nexus 7|BNTV250|Kindle Fire|Silk|GT-P1000)","i"),q=function(a,b){return a.test(b)},r=function(a){var r=a||navigator.userAgent,s=r.split("[FBAN");return"undefined"!=typeof s[1]&&(r=s[0]),s=r.split("Twitter"),"undefined"!=typeof s[1]&&(r=s[0]),this.apple={phone:q(b,r),ipod:q(c,r),tablet:!q(b,r)&&q(d,r),device:q(b,r)||q(c,r)||q(d,r)},this.amazon={phone:q(g,r),tablet:!q(g,r)&&q(h,r),device:q(g,r)||q(h,r)},this.android={phone:q(g,r)||q(e,r),tablet:!q(g,r)&&!q(e,r)&&(q(h,r)||q(f,r)),device:q(g,r)||q(h,r)||q(e,r)||q(f,r)},this.windows={phone:q(i,r),tablet:q(j,r),device:q(i,r)||q(j,r)},this.other={blackberry:q(k,r),blackberry10:q(l,r),opera:q(m,r),firefox:q(o,r),chrome:q(n,r),device:q(k,r)||q(l,r)||q(m,r)||q(o,r)||q(n,r)},this.seven_inch=q(p,r),this.any=this.apple.device||this.android.device||this.windows.device||this.other.device||this.seven_inch,this.phone=this.apple.phone||this.android.phone||this.windows.phone,this.tablet=this.apple.tablet||this.android.tablet||this.windows.tablet,"undefined"==typeof window?this:void 0},s=function(){var a=new r;return a.Class=r,a};"undefined"!=typeof module&&module.exports&&"undefined"==typeof window?module.exports=r:"undefined"!=typeof module&&module.exports&&"undefined"!=typeof window?module.exports=s():"function"==typeof define&&define.amd?define("isMobile",[],a.isMobile=s()):a.isMobile=s()}(this); alert(isMobile.any ? 'Mobile' : 'Not mobile');
这个特殊的浏览器嗅探代码是一个名为isMobile的库的代码。
选项2:window.orientation
测试如果窗口。定义方向:
var isMobile = window.orientation > -1; alert（isMobile ？“移动设备”：“非移动设备”）;
Note
并不是所有的触屏设备都是移动的，反之亦然。所以，如果你想实现一些专门针对触摸屏的东西，你不应该测试你的浏览器是否在移动设备上运行，而应该测试设备是否支持触摸屏:
var hasTouchscreen = 'ontouchstart'在窗口; 警报(hasTouchscreen ?'有触摸屏':'没有触摸屏');
