如何使用jQuery检测移动设备

有没有办法检测用户是否在jQuery中使用移动设备？类似于CSS@media属性？如果浏览器在手持设备上，我希望运行不同的脚本。

jQuery$.browser函数不是我想要的。

当前回答

这里还有一个使用纯JavaScript实现的建议（es6）

const detectDeviceType = () =>
    /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
        ? 'Mobile'
        : 'Desktop';

detectDeviceType();

2018-02-23 07:38:13

其他回答

我建议你结账http://wurfl.io/

简而言之，如果您导入一个很小的JavaScript文件：

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script>

您将看到一个JSON对象，其外观如下：

{
 "complete_device_name":"Google Nexus 7",
 "is_mobile":true,
 "form_factor":"Tablet"
}

（当然，这是假设您正在使用Nexus 7），您将能够执行以下操作：

if(WURFL.is_mobile) {
    //dostuff();
}

这就是你要找的。

免责声明：我为提供这项免费服务的公司工作。

2014-03-11 17:20:54

我使用这个解决方案，它在所有设备上都很好：

if (typeof window.orientation !== "undefined" || navigator.userAgent.indexOf('IEMobile') !== -1) {
   //is_mobile
}

2020-03-03 09:44:05

如果发现仅检查navigator.userAgent并不总是可靠的。还可以通过检查navigator.platform来实现更高的可靠性。对先前答案的简单修改似乎效果更好：

if (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ||
   (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.platform))) {
    // some code...
}

2013-01-24 15:10:33

Window.matchMedia（）

Window接口的matchMedia（）方法返回一个新的MediaQueryList对象，然后可用于确定文档匹配媒体查询字符串，并监视文档，以检测何时匹配（或停止匹配）该媒体查询用法说明您可以使用返回的媒体查询来执行这两项操作即时和事件驱动的检查，以查看文档是否匹配媒体查询。执行一次性、即时检查以查看文档匹配媒体查询，查看匹配属性的值，如果文档满足媒体查询的要求。如果您需要了解文档是否匹配媒体查询，您可以随时查看更改要传递到对象的事件。有一个很好的例子Window.devicePixelRatio上的文章。

let mql = window.matchMedia('(max-width: 767px)');

2019-06-27 20:41:11

我为.NET应用程序执行此操作。

在共享的_Layout.cshtml页面中，我添加了这个。

@{
    var isMobileDevice = HttpContext.Current.Request.Browser.IsMobileDevice;
}

<html lang="en" class="@((isMobileDevice)?"ismobiledevice":"")">

然后检查站点中的任何页面（jQuery）：

<script>
var isMobile = $('html').hasClass('ismobiledevice');
</script>

2015-12-10 23:48:01

如何使用jQuery检测移动设备

推荐文章

最新文章

标签