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+json 通用三级联动下拉列表
Apr 19 Javascript
基于jQuery架构javascript基础体系
Jan 01 Javascript
javascript 使用 NodeList需要注意的问题
Mar 04 Javascript
js数字转换为float,取N位小数
Feb 08 Javascript
浅谈node.js中async异步编程
Oct 22 Javascript
jQuery实现滑动页面固定顶部显示(可根据显示位置消失与替换)
Oct 28 Javascript
Javascript数组Array基础介绍
Mar 13 Javascript
vue.js绑定class和style样式(6)
Dec 09 Javascript
微信小程序 Toast自定义实例详解
Jan 20 Javascript
在js代码拼接dom对象到页面上的模板总结
Oct 21 Javascript
bootstrap与pagehelper实现分页效果
Dec 29 Javascript
微信小程序实现联动选择器
Feb 15 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
JAVA/JSP学习系列之二
2006/10/09 PHP
php disk_free_space 返回目录可用空间
2010/05/10 PHP
PHP常用处理静态操作类
2015/04/03 PHP
javaScript(JS)替换节点实现思路介绍
2013/04/17 Javascript
JavaScript操作HTML DOM节点的基础教程
2016/03/11 Javascript
jQuery弹出层插件popShow(改进版)用法示例
2017/01/23 Javascript
javascript过滤数组重复元素的实现方法
2017/05/03 Javascript
Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖
2018/11/25 Javascript
vue 基于element-ui 分页组件封装的实例代码
2018/12/10 Javascript
JSON字符串操作移除空串更改key/value的介绍
2019/01/05 Javascript
vue.js实现数据库的JSON数据输出渲染到html页面功能示例
2019/08/03 Javascript
JavaScript适配器模式原理与用法实例详解
2020/03/09 Javascript
JS 数组和对象的深拷贝操作示例
2020/06/06 Javascript
vue通过过滤器实现数据格式化
2020/07/20 Javascript
详解template标签用法(含vue中的用法总结)
2021/01/12 Vue.js
利用python实现数据分析
2017/01/11 Python
python os用法总结
2018/06/08 Python
python requests 测试代理ip是否生效
2018/07/25 Python
python字符串常用方法及文件简单读写的操作方法
2020/03/04 Python
Python yield的用法实例分析
2020/03/06 Python
python json.dumps中文乱码问题解决
2020/04/01 Python
Django 权限管理(permissions)与用户组(group)详解
2020/11/30 Python
css3.0新属性效果在ie下的解决方案
2010/05/10 HTML / CSS
Html5让容器充满屏幕高度或自适应剩余高度的布局实现
2020/05/14 HTML / CSS
英国最大的奢侈珠宝和手表网站:C W Sellors
2017/02/10 全球购物
专升本自我鉴定
2013/10/10 职场文书
旅游项目开发策划书
2014/01/18 职场文书
法人授权委托书格式
2014/04/08 职场文书
2014年群众路线教育实践活动整改措施
2014/09/24 职场文书
2015年档案管理工作总结
2015/04/08 职场文书
2016年党员干部廉政承诺书
2016/03/24 职场文书
为什么 Nginx 比 Apache 更牛逼
2021/03/31 Servers
如何在Python项目中引入日志
2021/05/31 Python
mysql聚集索引、辅助索引、覆盖索引、联合索引的使用
2022/02/12 MySQL
关于mysql中string和number的转换问题
2022/06/14 MySQL
Java代码规范与质量检测插件SonarLint的使用
2022/08/05 Java/Android