我在开发的Magento或Wordpress主题时,通过都会制作手机版本,为了实现某个片段在手机端和桌面端不同功能,又或者如果是手机设备,就跳转到指定的网页上,那么这里就需要用到JS来做判断了,下面有一个简单的检测方法,经试验是可行的。

  

  方法一:纯JS判断

  使用这方法既简单,又实用,不需要引入jQuery库,把以下代码加入到<head>里即可。

1 <script type=”text/javascript”>
2 if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
3 window.location = “mobile.html”; //可以换成http地址
4 }
5 </script>

  方法二:使用 Device.Js 库

  device.js 是一个用于检查设备用的插件,使用它你可以很方便的判断设备的操作系统,以及设备是纵向还是横向。

  首先,我们下载Device.js

  下载地址:https://github.com/matthewhudson/device.js

  STEP 1: 引入 JS 文件

1 <script src=”device.min.js”></script>

  STEP 2: 加入判断代码

1 <script type=”text/javascript”>
2 if(device.mobile()){
3 window.location = “shouji.html”;  //可以换成http地址
4 }
5 </script>

  Device.js 方法有很多,若你想实现对某个设备的判断,要以根据以下代码来替换device.mobile()。

  以上两种方法判断手机端都是很实用的,由其是电脑版网页和手机版网页分别用不同的网站域名时,使用该方法可以免去用户记2个域名烦恼!

  参考阅读:http://stackoverflow.com/questions/3514784/what-is-the-best-way-to-detect-a-mobile-device-in-jquery

   原文链接:http://www.shejidaren.com/the-best-way-to-detect-a-mobile-device.html

JS判断移动设备最佳方法 并实现跳转至手机版网页的更多相关文章

  1. JS判断移动设备最佳方法

    最实用的还是下面这个: 方法一:纯JS判断 使用这方法既简单,又实用,不需要引入jQuery库,把以下代码加入到<head>里即可. <script type=”text/javas ...

  2. JS判断访问设备、客户端操作系统类型

    先给出一个实例:判断windows.linux.android 复制以下代码另存为html文件即可. <html> <head> <title>判断操作系统< ...

  3. [转]JS判断访问设备、客户端操作系统类型

    本文转自:http://www.cnblogs.com/duanguyuan/p/3534470.html 先给出一个实例:判断windows.linux.android 复制以下代码另存为html文 ...

  4. 笔记:1.css样式,最前边加 @charset "utf-8";是为什么2.js判断各种浏览器的方法

    表明CSS文件的页面编码为UTF-8..如果这个CSS的文件编码也是UTF-8的话..那么在浏览器中看到的CSS文件的页面中中文的注释或者中文字体就可以正确显示为中文,如果CSS的文件编码和页面不一致 ...

  5. JS判断当前设备是 PC IOS Andriod

    JS判断当前设备是 PC IOS Andriod <script > window.onload = function(){ var isPc = IsPC(); var isAndroi ...

  6. JS判断访问设备(userAgent)加载不同页面 JS判断客户端操作系统类型(platform)

    //平台.设备和操作系统 var system ={ win : false, mac : false, xll : false }; //检测平台 var p = navigator.platfor ...

  7. JS判断字符串包含的方法

    本文实例讲述了JS判断字符串包含的方法.分享给大家供大家参考.具体如下: 1. 例子: 1 2 3 4 5 6 7 8 var tempStr = "tempText" ; var ...

  8. PHP和js判断访问设备是否是微信浏览器实例

    PHP和js判断访问设备是否是微信浏览器实例,代码非常精简,适合新手学习. js判断是否是微信浏览器: 1 function is_weixin() { 2 var ua = window.navig ...

  9. JS判断浏览器类型的方法总结(IE firefox chrome opera safari)

    JS判断浏览器类型的方法总结,可判别当前客户端所使用的浏览器是ie,firefox,safari,chrome或者是opera,另外js可以精确判断到ie浏览器的版本,依然直接上代码,需要的朋友可按照 ...

随机推荐

  1. HDU-----(1083)Courses(最大匹配)

    Courses Time Limit: 20000/10000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total S ...

  2. Java之线程———GUI线程(包含打字游戏和计时器俩个GUI实列)

    当java程序包含图形用户界面(GUI)时,Java虚拟机在运行应用程序时会自动启动更多的线程,其中有两个重要的线程:AWT-EventQuecue 和 AWT-Windows. AWT-EventQ ...

  3. C#中结构体和类的区别

    结构体和类同样能够定义字段,方法和构造函数,都能实例化对象,这样看来结构体和类的功能好像是一样的了,但是他们在数据的存储上是不一样的 C#结构体和类的区别问题:这两种数据类型的本质区别主要是各自指向的 ...

  4. jquery UI datepicker时间控件的使用

    参考: http://api.jqueryui.com/datepicker/#method-show 英文 http://www.helloweba.com/view-blog-168.html 中 ...

  5. Objective-C:Category

    Category可以在不需要创建子类或是修改原始类的基础上,动态为已经存在的类添加新的行为(方法),,这样可以保证类的原始设计规模较小,功能增加时再逐步扩展:实现了类的相关方法的模块化,把不同的类方法 ...

  6. jquery.query.js 插件的用法

    转载自:http://www.cnblogs.com/dachie/archive/2010/09/16/1827840.html 代码如下: var url = location.search; & ...

  7. 谷歌官方SwipeRefreshLayout下拉刷新的用法。

    <Android SwipeRefreshLayout:谷歌官方SDK包中的下拉刷新> 下拉刷新在如今移动开发中应用如此广泛和普遍,以至于谷歌干脆在SDK中给予支持.在android-su ...

  8. 这是BUG吗?

    百度首页的控制台里,有一段招聘信息,想必大家都知道吧,点击里面的链接地址跳到了百度招聘页面然后就发现了这个:,如果这不是BUG的话,那用户体验真是不好

  9. ncs安装及初次运行

    Tail-f NCS 作为网络配置程序和基础设备之间的接口,能够展现各种服务,修改各开发商不相同的设备配置,同时能及时同步网络设备状态到cdb(configuration database,配置数据库 ...

  10. [开发笔记]-Windows Service服务相关注意事项

    注意一:报错:“本地计算机上的 *** 服务启动后停止.某些服务在未由其他服务或程序使用时将自动停止.” 该问题主要的原因是 Service服务程序中有错误. 遇到这个问题时,无论是重新安装服务,还是 ...