js判断当前页面在移动设备还是在PC端中打开


Posted in Javascript onJanuary 06, 2016

本文实例讲解了js判断当前页面在移动设备还是在PC端中打开的详细代码,分享给大家供大家参考,具体内容如下

var browser = {
              versions: function () {
                var u = navigator.userAgent, app = navigator.appVersion;
                return {     //移动终端浏览器版本信息
                  trident: u.indexOf('Trident') > -1, //IE内核
                  presto: u.indexOf('Presto') > -1, //opera内核
                  webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
                  gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
                  mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
                  ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
                  android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
                  iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
                  iPad: u.indexOf('iPad') > -1, //是否iPad
                  webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部
                };
              }(),
              language: (navigator.browserLanguage || navigator.language).toLowerCase()
            }            
            if (browser.versions.mobile) {//判断是否是移动设备打开。browser代码在下面
                var ua = navigator.userAgent.toLowerCase();//获取判断用的对象
                if (ua.match(/MicroMessenger/i) == "micromessenger") {
                    //在微信中打开
                   setInterval(WeixinJSBridge.call('closeWindow'),2000);
                }
                if (ua.match(/WeiBo/i) == "weibo") {
                    //在新浪微博客户端打开
                }
                if (ua.match(/QQ/i) == "qq") {
                    //在QQ空间打开
                }
                if (browser.versions.ios) {
                    //是否在IOS浏览器打开
                } 
                if(browser.versions.android){
                    //是否在安卓浏览器打开
                }
            } else {
                //否则就是PC浏览器打开
                window.close();
            }

代码二:js判断用户的浏览设备是移动设备还是PC

最近做的一个网站页面中需要根据用户的访问设备的不同来显示不同的页面样式,主要是判断移动设备还是电脑浏览器访问的。

下面给出js判断处理代码,以作参考。

<script type="text/javascript">
    function browserRedirect() {
      var sUserAgent = navigator.userAgent.toLowerCase();
      var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
      var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
      var bIsMidp = sUserAgent.match(/midp/i) == "midp";
      var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
      var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
      var bIsAndroid = sUserAgent.match(/android/i) == "android";
      var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
      var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
      document.writeln("您的浏览设备为:");
      if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
        document.writeln("phone");
      } else {
        document.writeln("pc");
      }
    }

    browserRedirect();
  </script>

我用电脑上的浏览器,android设备,iphone,ipad均做过测试,此代码可行,各设备判断均正确。

以上就是本文的全部内容,希望对大家的学习有所帮助。

Javascript 相关文章推荐
基于jQuery的弹出消息插件 DivAlert之旅(一)
Apr 01 Javascript
一个JQuery写的点击上下滚动的小例子
Aug 27 Javascript
js触发asp.net的Button的Onclick事件应用
Feb 02 Javascript
JS实现图片翻书效果示例代码
Sep 09 Javascript
实现51Map地图接口(示例代码)
Nov 22 Javascript
javascript转换日期字符串为Date日期对象的方法
Feb 13 Javascript
javascript实现点击后变换按钮显示文字的方法
May 13 Javascript
javascript获取select标签选中的值
Jun 04 Javascript
遍历json获得数据的几种方法小结
Jan 21 Javascript
BootStrap 获得轮播中的索引和当前活动的焦点对象
May 11 Javascript
vue中引用阿里字体图标的方法
Feb 10 Javascript
Vue前端判断数据对象是否为空的实例
Sep 02 Javascript
js判断当前页面用什么浏览器打开的方法
Jan 06 #Javascript
javascript中闭包(Closure)详解
Jan 06 #Javascript
果断收藏9个Javascript代码高亮脚本
Jan 06 #Javascript
基于HTML+CSS,jQuery编写的简易计算器后续(添加了键盘监听)
Jan 05 #Javascript
JavaScript实现简单的tab选项卡切换
Jan 05 #Javascript
javascript实现简单的全选和反选功能
Jan 05 #Javascript
Javascript原型链的原理详解
Jan 05 #Javascript
You might like
提高define性能的php扩展hidef的安装和使用
2011/06/14 PHP
php实现数组筛选奇数和偶数示例
2014/04/11 PHP
php分页示例分享
2014/04/30 PHP
PHP数据源架构模式之表入口模式实例分析
2020/01/23 PHP
用Jquery重写windows.alert方法实现思路
2013/04/03 Javascript
JavaScript加强之自定义callback示例
2013/09/21 Javascript
javascript正则匹配汉字、数字、字母、下划线
2014/04/10 Javascript
微信小程序 支付简单实例及注意事项
2017/01/06 Javascript
jQuery实现鼠标跟随效果
2017/02/20 Javascript
基于hover的用法实例(推荐)
2017/07/04 Javascript
React Native第三方平台分享的实例(Android,IOS双平台)
2017/08/04 Javascript
switchery按钮的使用方法
2017/12/18 Javascript
细说webpack源码之compile流程-rules参数处理技巧(2)
2017/12/26 Javascript
vue中$refs的用法及作用详解
2018/04/24 Javascript
vue利用v-for嵌套输出多层对象,分别输出到个表的方法
2018/09/07 Javascript
Vue学习之常用指令实例详解
2020/01/06 Javascript
JavaScript实现电灯开关小案例
2020/03/30 Javascript
解决Vue使用bus总线时,第一次路由跳转时数据没成功传递问题
2020/07/28 Javascript
[01:36:19]Secret vs NB 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python多线程扫描端口代码示例
2018/02/09 Python
对numpy中array和asarray的区别详解
2018/04/17 Python
Django框架实现逆向解析url的方法
2018/07/04 Python
Python 循环终止语句的三种方法小结
2019/06/24 Python
Django的models中on_delete参数详解
2019/07/16 Python
python之yield和Generator深入解析
2019/09/18 Python
详解numpy矩阵的创建与数据类型
2019/10/18 Python
Html5 Canvas 实现一个“刮刮乐”游戏
2019/09/05 HTML / CSS
欧洲最大的婴幼儿服装及内衣公司:Petit Bateau(小帆船)
2016/08/16 全球购物
英国川宁茶官方网站:Twinings茶
2019/05/21 全球购物
传统软件工程与面向对象的软件工程有什么区别
2012/05/31 面试题
二手房买卖协议书
2014/04/10 职场文书
表扬稿范文
2015/01/17 职场文书
工程合作意向书范本
2015/05/09 职场文书
CSS3实现的文字弹出特效
2021/04/16 HTML / CSS
十大经典日本动漫排行榜 海贼王第三,犬夜叉仅第八
2022/03/18 日漫
【DOTA2】半决赛强强对话~ PSG LGD vs EHOME - DPC 2022 CN REGIONAL FINALS WINTER
2022/04/02 DOTA