javascript - 移动检测

Question

就目前情况而言，这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放， visit the help center以获得指导。

已关闭 10 年前。

有没有办法使用 Javascript 检测移动设备？另外，我研究了这样一个 XML，其中包含可以帮助识别移动手机的用户代理。

Answer 1

您可能有一个普通网站，并且如果满足某些条件(例如屏幕非常小，或者内容被缩小以适合小型物理设备中的大型“虚拟”屏幕)，您希望重定向到移动网站空间。那么，为什么不检查这些条件而不是测试无数的 UA 字符串。

尝试这样的事情:

为了让 UA 报告屏幕的物理像素大小，该标签必须出现在 html 页面中。 *

<meta name="viewport" 
      content="width=device-width, initial-scale=1, maximum-scale=1" />

现在，只需获取屏幕的大小并根据需要进行重定向。使用轻微的延迟。 **

setTimeout(function(){
  if ((screen.width < 480) || (screen.height < 480)) {
    location.replace('/mobile/');
  }
}, 100);

差不多就这些了。由于此页面已经为移动设备设置了视口(viewport)标记，因此您也可以执行相反的操作，在此处显示移动设备，如果屏幕更大，则重定向到完整网站。

编辑:我不确定为什么这个问题已被关闭；据我所知它非常适合 SO 格式。投票决定重新开放。

^{* 使用 javascript 插入它似乎不起作用(如果您找到方法，请纠正我)。如果不存在，手机将报告大于实际屏幕的虚拟屏幕尺寸。它似乎也不适用于 iframe，仅适用于顶级窗口(这是有道理的，因为 iframe 需要与外部窗口缩放相同的量，它们共享相同的视口(viewport))。}

^{** 一些移动浏览器保留上次加载页面的视口(viewport)大小，因此它们会报告大的虚拟屏幕大小几毫秒，直到它们注意到我猜的元标记。我找不到早期的事件来连接这个，如果您有更好的方法，请发表评论。在我的所有测试中，50 毫秒的延迟效果很好，100 毫秒应该是安全的。}