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 相关文章推荐
javascript 事件绑定问题
Jan 01 Javascript
js弹窗返回值详解(window.open方式)
Jan 11 Javascript
JavaScript实现的内存数据库LokiJS介绍和入门实例
Nov 17 Javascript
理解javascript对象继承
Apr 17 Javascript
AngularJS中关于ng-class指令的几种实现方式详解
Sep 17 Javascript
jQuery创建及操作xml格式数据示例
May 26 jQuery
简单了解JavaScript异步
May 23 Javascript
gulp构建小程序的方法步骤
May 31 Javascript
vue悬浮可拖拽悬浮按钮的实例代码
Aug 20 Javascript
15 分钟掌握vue-next响应式原理
Oct 13 Javascript
Angular6项目打包优化的实现方法
Dec 15 Javascript
Vue数字输入框组件示例代码详解
Jan 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
PHP的substr_replace将指定两位置之间的字符替换为*号
2011/05/04 PHP
php对象和数组相互转换的方法
2015/05/12 PHP
分享PHP源码批量抓取远程网页图片并保存到本地的实现方法
2015/12/01 PHP
PHP上传图片类显示缩略图功能
2016/06/30 PHP
JS遮罩层效果 兼容ie firefox jQuery遮罩层
2010/07/26 Javascript
jquery计算出left和top,让一个div水平垂直居中的简单实例
2016/07/13 Javascript
各式各样的导航条效果css3结合jquery代码实现
2016/09/17 Javascript
jQuery获取this当前对象子元素对象的方法
2016/11/29 Javascript
cocos creator Touch事件应用(触控选择多个子节点的实例)
2017/09/10 Javascript
vue mintui-Loadmore结合实现下拉刷新和上拉加载示例
2017/10/12 Javascript
AngularJS实现的简单拖拽功能示例
2018/01/02 Javascript
解决Vue2.0中使用less给元素添加背景图片出现的问题
2018/09/03 Javascript
js canvas实现二维码和图片合成的海报
2020/11/19 Javascript
jQuery+css last-child实现选择最后一个子元素操作示例
2018/12/10 jQuery
js实现随机点名程序
2020/09/17 Javascript
浅析vue中的nextTick
2020/12/28 Vue.js
Python使用tablib生成excel文件的简单实现方法
2016/03/16 Python
Python爬虫番外篇之Cookie和Session详解
2017/12/27 Python
Python利用splinter实现浏览器自动化操作方法
2018/05/11 Python
Python os.access()用法实例
2019/02/18 Python
浅谈Pytorch中的torch.gather函数的含义
2019/08/18 Python
python Dijkstra算法实现最短路径问题的方法
2019/09/19 Python
Django实现WebSSH操作物理机或虚拟机的方法
2019/11/06 Python
Python数据可视化图实现过程详解
2020/06/12 Python
基于opencv实现简单画板功能
2020/08/02 Python
世界上最大的在线汽车租赁预订平台:Rentalcars.com(支持中文)
2018/10/12 全球购物
Invicta手表官方商店:百年制表历史的瑞士腕表品牌
2019/09/26 全球购物
C语言基础笔试题
2013/04/27 面试题
港澳通行证委托书怎么写
2014/08/02 职场文书
公司授权委托书
2014/10/17 职场文书
个园导游词
2015/02/04 职场文书
高一军训感想
2015/08/07 职场文书
小学四年级班主任工作经验交流材料
2015/11/02 职场文书
2016年学校爱国卫生月活动总结
2016/04/06 职场文书
详解CocosCreator项目结构机制
2021/04/14 Javascript
Java由浅入深通关抽象类与接口(上篇)
2022/04/26 Java/Android