js判断当前设备

最近用bootstrap做自适应,发现仍然很难很好的兼容web端和PC端的现实。

仔细观察百度,淘宝,京东等大型网站,发现这些网站都有对应不同客户端的子站。

站点 PC端url web端url
百度 www.baidu.com m.baidu.com
淘宝 www.taobao.com m.taobao.com
京东 www.jd.com m.jd.com
网易 www.163.com 3g.163.com
/*判断当前设备跳转到指定地址。PCurl:PC端地址;WebUel:PC端地址;*/
function judgmentClient(PCurl,WebUel){
    var UserClient = navigator.userAgent.toLowerCase();
    var IsIPad = UserClient.match(/ipad/i) == "ipad";
    var IsIphoneOs = UserClient.match(/iphone os/i) == "iphone os";
    var IsMidp = UserClient.match(/midp/i) == "midp";
    var IsUc7 = UserClient.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
    var IsUc = UserClient.match(/ucweb/i) == "ucweb";
    var IsAndroid = UserClient.match(/android/i) == "android";
    var IsCE = UserClient.match(/windows ce/i) == "windows ce";
    var IsWM = UserClient.match(/windows mobile/i) == "windows mobile";
    if(IsIPad || IsIphoneOs || IsMidp || IsUc7 || IsUc || IsAndroid || IsCE || IsWM){
        window.location = WebUel;
    }else{
        window.location = PCurl;
    }
}

这套代码虽然可以直接使用,但会有个调用的问题。

假设现有一个PC页 和 一个Web页,这两个页面onload的时候都调用这个函数,结果是反复调用此函数,页面不停刷新。(有兴趣的朋友可以自行尝试)

起初这个调用bug想了两个小时就是绕不出来。(本菜有点愚钝)

后来终于想明白了,其实就是把这个拆开成两个函数,分开调用就OK了。

function PCjudgment(WebUel){
    var UserClient = navigator.userAgent.toLowerCase();
    var IsIPad = UserClient.match(/ipad/i) == "ipad";
    var IsIphoneOs = UserClient.match(/iphone os/i) == "iphone os";
    var IsMidp = UserClient.match(/midp/i) == "midp";
    var IsUc7 = UserClient.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
    var IsUc = UserClient.match(/ucweb/i) == "ucweb";
    var IsAndroid = UserClient.match(/android/i) == "android";
    var IsCE = UserClient.match(/windows ce/i) == "windows ce";
    var IsWM = UserClient.match(/windows mobile/i) == "windows mobile";
    if(IsIPad || IsIphoneOs || IsMidp || IsUc7 || IsUc || IsAndroid || IsCE || IsWM){
        window.location = WebUel;
    }
}
// web端调用判断PC设备
function Webjudgment(pcUel){
    var UserClient = navigator.userAgent.toLowerCase();
    var IsIPad = UserClient.match(/ipad/i) == "ipad";
    var IsIphoneOs = UserClient.match(/iphone os/i) == "iphone os";
    var IsMidp = UserClient.match(/midp/i) == "midp";
    var IsUc7 = UserClient.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
    var IsUc = UserClient.match(/ucweb/i) == "ucweb";
    var IsAndroid = UserClient.match(/android/i) == "android";
    var IsCE = UserClient.match(/windows ce/i) == "windows ce";
    var IsWM = UserClient.match(/windows mobile/i) == "windows mobile";
    if(!IsIPad && !IsIphoneOs && !IsMidp && !IsUc7 && !IsUc && !IsAndroid && !IsCE && !IsWM){
        window.location = pcUel;
    }
}

JS判断当前使用设备是pc端还是web端(转MirageFireFox)的更多相关文章

  1. 【方法】JS判断当前页面环境:PC端/移动端,安卓/IOS,微信环境/QQ环境等等

    [主要知识] 浏览器设备信息:navigator.userAgent(本文中主要用到知识) 浏览器版本信息:navigator.appVersion var ua = navigator.userAg ...

  2. js判断当前移动设备平台

    //js判断当前移动设备平台 var isiOs = false; var isAndroid = false; var isWindowsPhone = false; if(/(iPhone|iPa ...

  3. 1、移动端 2、后台 3、 移动端,Web 端 4、 PC端

    移动端: 1.公众号:停开心 住总物业 2.app:  iso Android 停开心,住总停开心 后台:停开心智慧停车管理平台(所有的停车场) 移动端,Web端: 海投OA,公司OA PC端:收费软 ...

  4. 移动端与Web端疫情数据展示

    1.题目要求 2.整体思想 首先是在前两阶段已经完成的echarts可视化.利用Jsoup爬取疫情数据基础上来进行调用与完善.大致思想是在Android Studio上完成交互去调用ecplise中的 ...

  5. dr-helper项目设计介绍(一个包括移动端和Web端的点餐管理系统)

    一.源代码路径 https://github.com/weiganyi/dr-helper 二.界面 通过浏览器訪问Web服务,能够看到界面例如以下: ADT-Bundle编译project生成dr- ...

  6. js判断当前浏览设备

    前端开发经常遇到需要判断用户的浏览设备,是pc端还是移动端,移动端使用的是什么手机系统?android.ios.ipad.windows phone等等,有时候还需要知道用户浏览页面是在微信中打开还是 ...

  7. js 判断当前操作系统是ios还是android还是电脑端

    js判断客户端是否是IOS或者是Android //如果返回true 则说明是Android function is_weixin() { var ua = window.navigator.user ...

  8. 关于emoji表情,支持在app端发送web端显示,web端发送给app端显示,web与wap端互相显示。

    要用到emoji.js和emoji.jquery.js两个插件配合实现三端互通. 1.app端发送的emoji表情----到服务器---服务器存储的是‘问号’,无法显示如图所示: 后台的同学也试验了网 ...

  9. 接口自动化、移动端、web端自动化如何做?

    1.<Python+Appium移动端自动化项目实战>-带您进入APP自动化测试的世界https://yuedu.baidu.com/ebook/765b38a5690203d8ce2f0 ...

随机推荐

  1. 博弈论之Nim游戏

    Nim游戏是组合游戏(Combinatorial Games)的一种,属于“Impartial Combinatorial Games”(以下简称ICG). 通常的Nim游戏的定义是这样的:有若干堆石 ...

  2. JAVA多线程之Synchronized关键字--对象锁的特点

    一,介绍 本文介绍JAVA多线程中的synchronized关键字作为对象锁的一些知识点. 所谓对象锁,就是就是synchronized 给某个对象 加锁.关于 对象锁 可参考:这篇文章 二,分析 s ...

  3. R读取MySQL数据出现乱码,解决该问题的方法总结

    最终的解决办法直接看 4 我的思路: 我用的都是utf-8编码,电脑系统win7, MySQL-Front进行数据库的可视化. 1.我用的是RStudio,先去设置R的默认编码: Tools→Glob ...

  4. Java学生成绩

    import java.util.*; public class guanlixiton { public static void main(String[] args) { Scanner in = ...

  5. Python爬虫从入门到放弃(二十二)之 爬虫与反爬虫大战

    爬虫与发爬虫的厮杀,一方为了拿到数据,一方为了防止爬虫拿到数据,谁是最后的赢家? 重新理解爬虫中的一些概念 爬虫:自动获取网站数据的程序反爬虫:使用技术手段防止爬虫程序爬取数据误伤:反爬虫技术将普通用 ...

  6. Python初学时购物车程序练习实例

    不多说了,直接上代码: #Author:Lancy Wu product_list=[ ('Iphone',5800), ('Mac Pro',9800), ('Bike', 800), ('Watc ...

  7. 14. Longest Common Prefix【leetcode】

    14. Longest Common Prefix Write a function to find the longest common prefix string amongst an array ...

  8. curl笔记

    -a/--append 上传文件时,附加到目标文件 -A/--user-agent 设置用户代理发送给服务器 -anyauth 可以使用"任何"身份验证方法 -b/--cookie ...

  9. fstab设置开机挂载--鸟哥[阅读]

    設定開機掛載: 手動處理 mount 不是很人性化,我們總是需要讓系統『自動』在開機時進行掛載的!本小節就是在談這玩意兒! 另外,從 FTP 伺服器捉下來的映像檔能否不用燒錄就可以讀取內容?我們也需要 ...

  10. oracle启动 init.ora spfile pfile[转]

    昨天晚上快下班的时候,公司数据库突然堵住了,一个buf表中累计了20多W的数据提取不出来,改了程序,效果不明显.因为之前有一次也重启过oracle,所以这次还是想把oracle重启一下,因为那些数据都 ...