如何使用JavaScript来判断是否为移动设备
来源:互联网 发布:mac 格式化u盘 编辑:程序博客网 时间:2024/06/05 23:07
由于移动设备的显示屏幕相对于桌面显示器来说小很多,在桌面显示器上能够正常显示的内容,到了移动设备中就不正常了。为了实现移动端和桌面端的相互跳转,我们可以通过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会在你的页面<html>
元素中插入相应的class类,例如:
device.js支持的设备有:
- iOS: iPhone, iPod, iPad
- Android: Phones & Tablets
- Blackberry: Phones & Tablets
- Windows: Phones & Tablets
- Firefox OS: Phones & Tablets
使用device.js插件的方法是在页面中引入device.js文件,在浏览器解析页面时,根据当前的设备,device.js就会在<html>
元素中插入不同的class类。这些class类对应的设备如下表所示:
设备名称class类iPadios ipad tabletiPhoneios iphone mobileiPodios ipod mobileAndroid Phoneandroid mobileAndroid Tabletandroid tabletBlackBerry Phoneblackberry mobileBlackBerry Tabletblackberry tabletWindows Phonewindows mobileWindows Tabletwindows tabletFirefox OS Phonefxos mobileFirefox OS Tabletfxos tabletMeeGomeegoDesktopdesktopTelevisiontelevision
根据当前设备屏幕是横向还是纵向的,device.js会在<html>
元素中插入相应的class类。
设备方向class类LandscapelandscapePortraitportrait
另外,device.js还提供了一组用于判断设备的js方法,使用方法如下:
if
(device.mobile()){
//执行移动设备的方法
}
所有可用的判断方法如下表所示:
设备名称JavaScript 方法Mobiledevice.mobile()Tabletdevice.tablet()Desktopdevice.desktop()iOSdevice.ios()iPaddevice.ipad()iPhonedevice.iphone()iPoddevice.ipod()Androiddevice.android()Android Phonedevice.androidPhone()Android Tabletdevice.androidTablet()BlackBerrydevice.blackberry()BlackBerry Phonedevice.blackberryPhone()BlackBerry Tabletdevice.blackberryTablet()Windowsdevice.windows()Windows Phonedevice.windowsPhone()Windows Tabletdevice.windowsTablet()Firefox OSdevice.fxos()Firefox OS Phonedevice.fxosPhone()Firefox OS Tabletdevice.fxosTablet()MeeGodevice.meego()Televisiondevice.television()
判断设备方向的js方法有:
设备方向JavaScript方法Landscapedevice.landscape()Portraitdevice.portrait()阅读全文
0 0
- 如何使用JavaScript来判断是否为移动设备
- 如何使用JavaScript来判断是否为移动设备
- 判断是否为移动设备
- 使用js判断访问者是否为移动设备
- php 判断是否为移动设备访问
- php判断客户端是否为移动设备
- js判断是否为移动设备
- javascript判断是否为移动终端
- javascript判断终端是否为移动端
- Js判断客户端是否为PC还是手持移动设备
- javaweb:判断当前请求是否为移动设备访问
- javaweb:判断当前请求是否为移动设备访问
- JS判断当前是否为移动设备的浏览器
- javaweb:判断当前请求是否为移动设备访问
- javaweb:判断当前请求是否为移动设备访问
- javaweb:判断当前请求是否为移动设备访问
- Js判断客户端是否为PC还是手持移动设备
- 判断是否是移动设备
- 关于如何减缓、解除hibernate与domain之间的强关系限制以及与mybatis简单对比
- 可视化工具–D3–比例尺的使用(quantitative)
- 商城项目实战35:购物车功能实现
- C++后台开发校招面试常见问题
- 序列化和反序列化二叉树(java版)
- 如何使用JavaScript来判断是否为移动设备
- centOs7.0安装docker
- Js中的window.parent ,window.top,window.self 详解
- window.open自适应父窗口并垂直居中
- 2017.5.27测试 3. 逃避系统警察
- Astronomy POJ
- 2017苹果开发者大会看点汇总
- intellij安装配置Tomcat
- Android布局优化技巧