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 相关文章推荐
用正则获取指定路径文件的名称
Feb 27 Javascript
dojo 之基础篇(三)之向服务器发送数据
Mar 24 Javascript
js控制的回到页面顶端goTop的代码实现
Mar 20 Javascript
Bootstrap创建可折叠的组件
Feb 23 Javascript
详解JavaScript的另类写法
Apr 11 Javascript
JavaScript利用fetch实现异步请求的方法实例
Jul 26 Javascript
JS实现合并json对象的方法
Oct 10 Javascript
vue2.0 + element UI 中 el-table 数据导出Excel的方法
Mar 02 Javascript
微信小程序授权登录解决方案的代码实例(含未通过授权解决方案)
May 10 Javascript
vue data恢复初始化数据的实现方法
Oct 31 Javascript
使用JavaScript和MQTT开发物联网应用示例解析
Aug 07 Javascript
超详细小程序定位地图模块全系列开发教学
Nov 24 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
PHP实现微信公众平台音乐点播
2014/03/20 PHP
php实现Session存储到Redis
2015/11/11 PHP
js获取变量
2006/08/24 Javascript
Json对象替换字符串占位符实现代码
2010/11/17 Javascript
jquery ajax中使用jsonp的限制解决方法
2013/11/22 Javascript
js确认删除对话框效果的示例代码
2014/02/20 Javascript
在jQuery中处理XML数据的大致方法
2015/08/14 Javascript
jQuery Validate表单验证插件 添加class属性形式的校验
2016/01/18 Javascript
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
2016/04/07 Javascript
JavaScript判断页面加载完之后再执行预定函数的技巧
2016/05/17 Javascript
手机端图片缩放旋转全屏查看PhotoSwipe.js插件实现
2016/08/25 Javascript
Bootstrap基本组件学习笔记之列表组(11)
2016/12/07 Javascript
性能优化之代码优化页面加载速度
2017/03/01 Javascript
JavaScript实现类似淘宝的购物车效果
2017/03/16 Javascript
jQuery插件FusionCharts实现的3D帕累托图效果示例【附demo源码】
2017/03/25 jQuery
初识 Vue.js 中的 *.Vue文件
2017/11/22 Javascript
Vue动态创建注册component的实例代码
2019/06/14 Javascript
基于JS实现操作成功之后自动跳转页面
2020/09/25 Javascript
python的else子句使用指南
2016/02/27 Python
python 模拟创建seafile 目录操作示例
2019/09/26 Python
Django Admin后台模型列表页面如何添加自定义操作按钮
2020/11/11 Python
Three Graces London官网:英国奢侈品牌
2021/03/18 全球购物
EJB timer的种类
2014/10/28 面试题
轻金属冶金专业毕业生自荐信
2013/11/02 职场文书
小学生期末自我鉴定
2014/01/19 职场文书
销售业务员岗位职责
2014/01/29 职场文书
2014年人事行政工作总结
2014/12/03 职场文书
初中优秀学生评语
2014/12/29 职场文书
民间借贷借条范本
2015/05/25 职场文书
债务追讨律师函
2015/06/24 职场文书
《小蝌蚪找妈妈》教学反思
2016/02/23 职场文书
Python实现简繁体转换
2021/06/07 Python
详解非极大值抑制算法之Python实现
2021/06/28 Python
SQLServer之常用函数总结详解
2021/08/30 SQL Server
详解使用内网穿透工具Ngrok代理本地服务
2022/03/31 Servers
mysql sock 文件解析及作用讲解
2022/07/15 MySQL