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 操作下拉列表框实现代码
Feb 22 Javascript
输入密码检测大写是否锁定js实现代码
Dec 03 Javascript
Knockout数组(observable)使用详解示例
Nov 15 Javascript
js style动态设置table高度
Oct 21 Javascript
AngularJS自动表单验证
Feb 01 Javascript
Bootstrap编写一个兼容主流浏览器的受众门户式风格页面
Jul 01 Javascript
js中window.open的参数及注意注意事项
Jul 06 Javascript
LayerClose弹窗关闭刷新方法
Aug 17 Javascript
vue transition 在子组件中失效的解决
Nov 12 Javascript
javascript 易错知识点实例小结
Apr 25 Javascript
Bootstrap table 服务器端分页功能实现方法示例
Jun 01 Javascript
解决vue中provide inject的响应式监听
Apr 19 Vue.js
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实现的农历算法实例
2015/08/11 PHP
php封装的smartyBC类完整实例
2016/10/19 PHP
js 模拟实现类似c#下的hashtable的简单功能代码
2010/01/24 Javascript
EXTJS内使用ACTIVEX控件引起崩溃问题的解决方法
2010/03/31 Javascript
iPhone手机上搭建nodejs服务器步骤方法
2015/07/06 NodeJs
JavaScript处理解析JSON数据过程详解
2015/09/11 Javascript
js输出数据精确到小数点后n位代码
2016/07/02 Javascript
浅谈Angularjs link和compile的使用区别
2016/10/21 Javascript
Bootstrap基本组件学习笔记之分页(12)
2016/12/08 Javascript
vue实现简单实时汇率计算功能
2017/01/15 Javascript
jquery仿ps颜色拾取功能
2017/03/08 Javascript
ES6中Iterator与for..of..遍历用法分析
2017/03/31 Javascript
微信小程序开发之map地图实现教程
2017/06/08 Javascript
详解如何去除vue项目中的#——History模式
2017/10/13 Javascript
bootstrap-Treeview实现级联勾选
2017/11/23 Javascript
详解Vue前端对axios的封装和使用
2019/04/01 Javascript
JS实现普通轮播图特效
2020/01/01 Javascript
Js Snowflake(雪花算法)生成随机ID的实现方法
2020/08/26 Javascript
跟老齐学Python之复习if语句
2014/10/02 Python
在Python程序中进行文件读取和写入操作的教程
2015/04/28 Python
详解Python编程中基本的数学计算使用
2016/02/04 Python
python+selenium+autoit实现文件上传功能
2017/08/23 Python
Python实现串口通信(pyserial)过程解析
2019/09/25 Python
Spring实战之使用util:命名空间简化配置操作示例
2019/12/09 Python
python基于property()函数定义属性
2020/01/22 Python
三步解决python PermissionError: [WinError 5]拒绝访问的情况
2020/04/22 Python
解决python打开https出现certificate verify failed的问题
2020/09/03 Python
使用spring mvc+localResizeIMG实现HTML5端图片压缩上传的功能
2016/12/16 HTML / CSS
日语翻译个人求职的自我评价
2013/10/14 职场文书
2014年自我评价
2014/01/04 职场文书
三个儿子教学反思
2014/02/03 职场文书
党的群众路线教育实践活动宣传方案
2014/02/23 职场文书
团队拓展训练感想
2015/08/07 职场文书
解析Redis Cluster原理
2021/06/21 Redis
一文弄懂MySQL中redo log与binlog的区别
2022/02/15 MySQL
漫画《催眠麦克风-Dawn Of Divisions》第二卷PV公开
2022/04/05 日漫