如何使用JavaScript来判断是否为移动设备
来源:互联网 发布:js获取json中的数据 编辑:程序博客网 时间:2024/06/06 01:38
由于移动设备的显示屏幕相对于桌面显示器来说小很多,在桌面显示器上能够正常显示的内容,到了移动设备中就不正常了。为了实现移动端和桌面端的相互跳转,我们可以通过JavaScript来判断当前的设备是否是移动设备,然后执行相应的代码。
通过js来判断当前的设备
下面的代码片段能够检测6种不同的移动设备:
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) { // 执行相应代码或直接跳转到手机页面} else { // 执行桌面端代码}
上面的js代码可以判断当前设备是否是Android、iPhone或iPad等六种移动设备中的一种。如果你需要单独检测当前设备是否是某种指定的设备,例如是否是iPhone,可以使用下面的代码:
if( iPhone.test(navigator.userAgent) ) { alert("这是iPhone设备");} else { alert("不是iPhone设备");}
通过device.js来判断当前的设备
device.js是一个用于检查设备操作系统的js插件。使用它可以检测iOS, Android, Blackberry, Windows, Firefox OS, MeeGo, AppleTV等系统,还可以判断当前的设备是横向的还是纵向的。
device.js会在你的页面元素中插入相应的class类,例如:
在iphone中使用device.js
在iphone中使用device.js
在Android平板中使用device.js
在Android平板中使用device.js
在蓝莓系统中使用device.js
在蓝莓系统中使用device.js
device.js支持的设备有:
iOS: iPhone, iPod, iPadAndroid: Phones & TabletsBlackberry: Phones & TabletsWindows: Phones & TabletsFirefox OS: Phones & Tablets
使用device.js插件的方法是在页面中引入device.js文件,在浏览器解析页面时,根据当前的设备,device.js就会在元素中插入不同的class类。这些class类对应的设备如下表所示:
设备名称 class类
iPad ios ipad tablet iPhone ios iphone mobile iPod ios ipod mobile Android Phone android mobile Android Tablet android tablet BlackBerry Phone blackberry mobile BlackBerry Tablet blackberry tablet Windows Phone windows mobile Windows Tablet windows tablet Firefox OS Phone fxos mobile Firefox OS Tablet fxos tablet MeeGo
meego Desktop desktop Television television
根据当前设备屏幕是横向还是纵向的,device.js会在元素中插入相应的class类。
设备方向 class类
Landscape landscape
Portrait portrait
另外,device.js还提供了一组用于判断设备的js方法,使用方法如下:
if(device.mobile()){ //执行移动设备的方法}
所有可用的判断方法如下表所示:
设备名称 JavaScript 方法
Mobile device.mobile() Tablet device.tablet() Desktop device.desktop() iOS device.ios() iPad device.ipad() iPhone device.iphone() iPod device.ipod() Android device.android() Android Phone device.androidPhone() Android Tablet device.androidTablet() BlackBerry device.blackberry() BlackBerry Phone device.blackberryPhone() BlackBerry Tablet device.blackberryTablet() Windows device.windows() Windows Phone device.windowsPhone() Windows Tablet device.windowsTablet() Firefox OS device.fxos() Firefox OS Phone device.fxosPhone() Firefox OS Tablet device.fxosTablet() MeeGo device.meego() Television device.television()
判断设备方向的js方法有:
设备方向 JavaScript方法
Landscape device.landscape() Portrait device.portrait()
- 如何使用JavaScript来判断是否为移动设备
- 如何使用JavaScript来判断是否为移动设备
- 判断是否为移动设备
- 使用js判断访问者是否为移动设备
- php 判断是否为移动设备访问
- php判断客户端是否为移动设备
- js判断是否为移动设备
- javascript判断是否为移动终端
- javascript判断终端是否为移动端
- Js判断客户端是否为PC还是手持移动设备
- javaweb:判断当前请求是否为移动设备访问
- javaweb:判断当前请求是否为移动设备访问
- JS判断当前是否为移动设备的浏览器
- javaweb:判断当前请求是否为移动设备访问
- javaweb:判断当前请求是否为移动设备访问
- javaweb:判断当前请求是否为移动设备访问
- Js判断客户端是否为PC还是手持移动设备
- 判断是否是移动设备
- HDU 1789 Doing Homework again(贪心)
- leetcode 415. Add Strings
- 图像处理神器 ImageMagick 命令介绍
- html知识点:#语义元素;#iframe;#块元素与内联元素display
- vector和map的效率简要比较
- 如何使用JavaScript来判断是否为移动设备
- 看了就懂的Websocket原理
- 查看并计算MySQL最大连接数
- 利用fiddler给android模拟器抓包
- 禅道安装
- [Leetcode] 21. Merge Two Sorted Lists
- Eigen的error C2338: INVALID_MATRIX_TEMPLATE_PARAMETERS
- jQuery cookie的用法,及js操作cookie文档
- JSP重定向工作文件夹配置方法