• JS 判断是否是手机端并跳转操作


    JS 判断运行当前脚本的应用程序是否为手机端或者一些其他信息,在我的工作中遇到的不是十分频繁,被我的同事一问就给问住了,所以把之前找到的一些知识点整理出来,供大家参考,若哪里不对欢迎指出,我会及时的更改 (#^.^#)。

     window.navigator

     先从这个属性入手:window.navigator 返回一个navigator对象的引用,可以用它来查询一些关于运行当前脚本的应用程序的相关信息。

    常用属性和方法:(想知道详细属性和方法的请点MDN

    Navigator 对象属性 

    属性说明
    appCodeName 返回当前浏览器的内部“代码”名称,该名称可能是不"正确"的.
    appName 返回当前浏览器的正式名称,该名称可能是不"正确"的.
    appVersion 返回当前浏览器的版本号,该值可能是不"正确"的.
    cookieEnabled 返回一个布尔值,表明当前浏览器是否启用了cookies.
    platform 返回一个字符串,表明当前所使用的系统平台类型.
    userAgent 返回当前浏览器的user agent字符串.

    Navigator 对象方法

    方法描述
    javaEnabled() 表明当前浏览器是否启用了对Java的支持.
    vibrate() 如果设备支持震动(手机或其他),则触发设备震动.
    registerContentHandler 允许网站将自己注册成为一个给定MIME类型的内容的处理程序.

    eg: 

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    </head>
    <body>
    <div id="test"></div>
    <script>
    txt = "<p>浏览器代号: " + navigator.appCodeName + "</p>";
    txt+= "<p>浏览器名称: " + navigator.appName + "</p>";
    txt+= "<p>浏览器版本: " + navigator.appVersion + "</p>";
    txt+= "<p>启用Cookies: " + navigator.cookieEnabled + "</p>";
    txt+= "<p>硬件平台: " + navigator.platform + "</p>";
    txt+= "<p>用户代理: " + navigator.userAgent + "</p>";
    txt+= "<p>用户代理语言: " + navigator.systemLanguage + "</p>";
    document.getElementById("test").innerHTML=txt;
    </script>
    </body>
    </html>

    常用跳转代码 

    <script type="text/javascript"> 
     // borwserRedirect
     (function browserRedirect(){
      var sUserAgent = navigator.userAgent.toLowerCase();
      var bIsIpad = sUserAgent.match(/ipad/i) == 'ipad';
      var bIsIphone = 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) == 'web';
      var bIsCE = sUserAgent.match(/windows ce/i) == 'windows ce';
      var bIsWM = sUserAgent.match(/windows mobile/i) == 'windows mobile';
      var bIsAndroid = sUserAgent.match(/android/i) == 'android';
      if(bIsIpad || bIsIphone || bIsMidp || bIsUc7 || bIsUc || bIsCE || bIsWM || bIsAndroid ){
      window.location.href = '跳转的移动端网址';
      }
     })();
     </script>
    <script type="text/javascript"> 
    <!-- 
      //平台、设备和操作系统 
      var system = { 
       win: false, 
       mac: false, 
       xll: false, 
       ipad:false
      }; 
      //检测平台 
      var p = navigator.platform; 
      system.win = p.indexOf("Win") == 0; 
      system.mac = p.indexOf("Mac") == 0; 
      system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); 
      system.ipad = (navigator.userAgent.match(/iPad/i) != null)?true:false; 
      //跳转语句,如果是手机访问就自动跳转到wap.baidu.com页面 
      if (system.win || system.mac || system.xll||system.ipad) { 

         //  something.... 

      } else { 
       window.location.href = "PC端网址"; 
      } 
    --> 
    </script>

    腾讯跳转 

    <script type="text/javascript">
    if(window.location.toString().indexOf('pref=padindex') != -1){
    }else{
     if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){ 
      if(window.location.href.indexOf("?mobile")<0){
      try{
       if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
        window.location.href="手机端网址";
       }else if(/iPad/i.test(navigator.userAgent)){
        //window.location.href="pad网址"
       }else{
        window.location.href="PC端网址"
       }
      }catch(e){}
     }
     }
    }
    </script>
    <script type="text/javascript"> 
    <!-- 
      //平台、设备和操作系统 
      var system = { 
       win: false, 
       mac: false, 
       xll: false, 
       ipad:false
      }; 
      //检测平台 
      var p = navigator.platform; 
      system.win = p.indexOf("Win") == 0; 
      system.mac = p.indexOf("Mac") == 0; 
      system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); 
      system.ipad = (navigator.userAgent.match(/iPad/i) != null)?true:false; 
      //跳转语句,如果是手机访问就自动跳转到手机端网页
      if (system.win || system.mac || system.xll||system.ipad) { 
      } else { 
       window.location.href = "PC网页"; 
      } 
    --> 
    </script>
    JS 判断浏览器客户端类型(ipad,iphone,android)  
    <script type="text/javascript">  
     var bForcepc = fGetQuery("dv") == "pc"; 
     function fBrowserRedirect(){ 
      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"; 
      if(bIsIpad){ 
       var sUrl = location.href;  
       if(!bForcepc){ 
        window.location.href = "手机网址"; 
       } 
      } 
      if(bIsIphoneOs || bIsAndroid){ 
       var sUrl = location.href;  
       if(!bForcepc){ 
        window.location.href = "手机网址"; 
       } 
      } 
      if(bIsMidp||bIsUc7||bIsUc||bIsCE||bIsWM){ 
       var sUrl = location.href;  
       if(!bForcepc){ 
        window.location.href = ""; 
       } 
      } 
     } 
     function fGetQuery(name){//获取参数值 
      var sUrl = window.location.search.substr(1); 
      var r = sUrl.match(new RegExp("(^|&)" + name + "=([^&]*)(&|$)")); 
      return (r == null ? null : (r[2])); 
     } 
     function fShowVerBlock(){  
      if(bForcepc){ 
       document.getElementByIdx_x("dv_block").style.display = "block"; 
      } 
      else{ 
       document.getElementByIdx_x("ad_block").style.display = "block"; 
      } 
     } 
     fBrowserRedirect(); 
     </script>

    测试是什么终端 

    var u = navigator.userAgent;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
    var isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
    alert('是否是Android:'+isAndroid);
    alert('是否是iOS:'+isiOS); 

    参考网址 

    https://developer.mozilla.org/zh-CN/docs/Web/API/Window/navigator 

    http://www.jb51.net/article/104661.htm

  • 相关阅读:
    ocx手动添加自定义消息
    ocx手动添加方法
    ocx手动添加事件
    c判断文件是否存在
    unity hub 更新之后,出现了好多问题。
    asp.net core系列 77 webapi响应压缩
    python:生成半年内的巡检日报execl
    python:selenium爬取boss网站被关小黑屋
    k8s 批量安装脚本
    sysctl: cannot stat /proc/sys/net/bridge/bridgenfcallip6tables: No such file or directory
  • 原文地址:https://www.cnblogs.com/yangyang63963/p/9014822.html
Copyright © 2020-2023  润新知