我被要求创建一个实际的 HTML 页面/JavaScript 来模拟使用 JavaScript 代码检测移动设备（iPhone/iPad/Android）。然后，这会将用户带到不同的屏幕，询问他们的电子邮件地址。
如何使用 JavaScript 检测移动设备？
IT技术
javascript
html
mobile
device
2021-01-26 13:26:20
6个回答
我知道这个答案即将到来晚了3年，但没有其他的答案确实是100％正确的。如果您想检测用户是否使用任何形式的移动设备（Android、iOS、黑莓、Windows Phone、Kindle 等），那么您可以使用以下代码：
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|Opera Mini/i.test(navigator.userAgent)) {
// Take the user to a different screen here.
}
您将检测请求浏览器的用户代理字符串，然后根据它是否来自移动浏览器来决定它是什么。这个设备并不完美，而且永远不会是因为用户代理没有针对移动设备进行标准化（至少据我所知）。
该站点将帮助您创建代码：http : //www.hand-interactive.com/resources/detect-mobile-javascript.htm
示例：
您可以通过执行以下操作在 javascript 中获取用户代理：
var uagent = navigator.userAgent.toLowerCase();
然后以与此相同的格式进行检查（仅使用 iPhone 作为快速示例，但其他人需要稍有不同）
function DetectIphone()
{
if (uagent.search("iphone") > -1)
alert('true');
else
alert('false');
}
编辑
您将创建一个简单的 HTML 页面，如下所示：
<html>
<head>
<title>Mobile Detection</title>
</head>
<body>
<input type="button" OnClick="DetectIphone()" value="Am I an Iphone?" />
</body>
</html>
<script>
function DetectIphone()
{
var uagent = navigator.userAgent.toLowerCase();
if (uagent.search("iphone") > -1)
alert('true');
else
alert('false');
}
</script>
一个非常简单的解决方案是检查屏幕宽度。由于几乎所有移动设备的最大屏幕宽度为 480px（目前），因此非常可靠：
if( screen.width <= 480 ) {
location.href = '/mobile.html';
}
用户代理字符串也是一个查看的地方。然而，前一种解决方案仍然更好，因为即使某些该死的设备没有正确响应用户代理，屏幕宽度也不会撒谎。
这里唯一的例外是平板电脑，如 ipad。这些设备的屏幕宽度比智能手机大，我可能会使用 user-agent-string。
if(navigator.userAgent.match(/iPad/i)){
//code for iPad here
}
if(navigator.userAgent.match(/iPhone/i)){
//code for iPhone here
}
if(navigator.userAgent.match(/Android/i)){
//code for Android here
}
if(navigator.userAgent.match(/BlackBerry/i)){
//code for BlackBerry here
}
if(navigator.userAgent.match(/webOS/i)){
//code for webOS here
}
var isMobileDevice = navigator.userAgent.match(/iPad|iPhone|iPod/i) != null
|| screen.width <= 480;