js判断客户端是移动端还是PC端

//判断客户端是移动端还是pc端
//userAgent用户代理
function IsPC() {
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone",
"SymbianOS", "Windows Phone",
"iPad", "iPod"];
var flag = true;
for (var i = 0; i < Agents.length; i++) {
if (userAgentInfo.indexOf(Agents[i]) !=-1) {
flag = false;
break;
}
}
return flag;
}

//方法2,使用正则表达式

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {  
    //alert(navigator.userAgent);    ipone移动端
    window.location.href ="iPhone.html";  
} else if (/(Android)/i.test(navigator.userAgent)) {  
    //alert(navigator.userAgent);   android移动端
    window.location.href ="Android.html";  
} else {  
//PC端
    window.location.href ="pc.html";  
};  

方法3

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应该程序,没有头部与底部  
                weixin: u.indexOf('MicroMessenger') > -1, //是否微信   
                qq: u.match(/\sQQ/i) == " qq" //是否QQ  
            };  
         }(),  
         language:(navigator.browserLanguage || navigator.language).toLowerCase()  
}   

  if(browser.versions.mobile || browser.versions.ios || browser.versions.android ||   
    browser.versions.iPhone || browser.versions.iPad){        
        window.location = "http://m.zhaizhainv.com";      
  }  

//方法4

var os = function() {  
     var ua = navigator.userAgent,  
     isWindowsPhone = /(?:Windows Phone)/.test(ua),  
     isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone,   
     isAndroid = /(?:Android)/.test(ua),   
     isFireFox = /(?:Firefox)/.test(ua),   
     isChrome = /(?:Chrome|CriOS)/.test(ua),  
     isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)),  
     isPhone = /(?:iPhone)/.test(ua) && !isTablet,  
     isPc = !isPhone && !isAndroid && !isSymbian;  
     return {  
          isTablet: isTablet,  
          isPhone: isPhone,  
          isAndroid : isAndroid,  
          isPc : isPc  
     };  

//方法5 检测平台

<script language="javascript">   
//平台、设备和操作系统    
var system ={    
win : false,    
mac : false,    
xll : 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);    
//跳转语句,如果是手机访问就自动跳转到caibaojian.com页面    
if(system.win||system.mac||system.xll){    
}else{    
window.location.href="http://caibaojian.com";    
}    
</script>  

//方法6

<script language="javascript">   
function is_mobile() {  
    var regex_match = /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte-|longcos|pantech|gionee|^sie-|portalmmm|jigs browser|hiptop|^benq|haier|^lct|operas*mobi|opera*mini|320x320|240x320|176x220)/i;  
  var u = navigator.userAgent;  
  if (null == u) {  
   return true;  
  }  
  var result = regex_match.exec(u);  

  if (null == result) {  
   return false  
  } else {  
   return true  
  }  
 }  
 if (is_mobile()) {  
  document.location.href= 'http://caibaojian.com';  //修改http://caibaojian.com为你所需跳转目标页地址  
 }  
</script>  

//百度webapp版本

<!---识别手机或电脑的js开始--->  
<script language="javascript">   
(function(){  
    var res = GetRequest();  
    var par = res['index'];  
    if(par!='gfan'){  
        var ua=navigator.userAgent.toLowerCase();  
        var contains=function (a, b){  
            if(a.indexOf(b)!=-1){return true;}  
        };  
//将下面的http://caibaojian.com改成你的wap手机版页面地址 如我的 http://caibaojian.com  
        var toMobileVertion = function(){  
            window.location.href = 'http://caibaojian.com/'  
        }  

        if(contains(ua,"ipad")||(contains(ua,"rv:1.2.3.4"))||(contains(ua,"0.0.0.0"))||(contains(ua,"8.0.552.237"))){return false}  
        if((contains(ua,"android") && contains(ua,"mobile"))||(contains(ua,"android") && contains(ua,"mozilla")) ||(contains(ua,"android") && contains(ua,"opera"))  
    ||contains(ua,"ucweb7")||contains(ua,"iphone")){toMobileVertion();}  
    }  
})();  
function GetRequest() {  
   var url = location.search; //获取url中"?"符后的字串  
   var theRequest = new Object();  
   if (url.indexOf("?") != -1) {  
      var str = url.substr(1);  
      strs = str.split("&");  
      for(var i = 0; i < strs.length; i ++) {  
         theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);  
      }  
   }  
   return theRequest;  
}  
</script>  
<!---识别手机或电脑的js结束--->  

//方法7百度


function uaredirect(f) {
 try {
  if (document.getElementById("bdmark") != null) {
   return
  }
  var b = false;
  if (arguments[1]) {
   var e = window.location.host;
   var a = window.location.href;
   if (isSubdomain(arguments[1], e) == 1) {
    f = f + "/#m/" + a;
    b = true
   } else {
    if (isSubdomain(arguments[1], e) == 2) {
     f = f + "/#m/" + a;
     b = true
    } else {
     f = a;
     b = false
    }
   }
  } else {
   b = true
  }
  if (b) {
   var c = window.location.hash;
   if (!c.match("fromapp")) {
    if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|SymbianOS)/i))) {
     location.replace(f)
    }
   }
  }
 } catch(d) {}
}
function isSubdomain(c, d) {
 this.getdomain = function(f) {
  var e = f.indexOf("://");
  if (e > 0) {
   var h = f.substr(e + 3)
  } else {
   var h = f
  }
  var g = /^www\./;
  if (g.test(h)) {
   h = h.substr(4)
  }
  return h
 };
 if (c == d) {
  return 1
 } else {
  var c = this.getdomain(c);
  var b = this.getdomain(d);
  if (c == b) {
   return 1
  } else {
   c = c.replace(".", "\\.");
   var a = new RegExp("\\." + c + "$");
   if (b.match(a)) {
    return 2
   } else {
    return 0
   }
  }
 }
};

以上内容参考:
kongjiea的博客
脚本之家

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在 Nuxt.js 中,我们可以使用插件判断是 PC 端还是移动端,然后根据不同的设备跳转到不同的路由。 下面的代码演示了如何编写一个插件来实现这个功能: ```javascript // plugins/device.js export default ({ app }, inject) => { const userAgent = process.server ? app.$ua.get('User-Agent') : navigator.userAgent const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test( userAgent ) inject('device', { isMobile, redirect(path) { const url = isMobile ? `/m${path}` : path if (process.client) { window.location.href = url } else { app.context.redirect(url) } } }) } ``` 在插件中,我们首先获取了用户代理(userAgent),然后使用正则表达式来判断是否是移动设备。如果是移动设备,我们就将路径前缀设置为 "/m",否则就保持原样。 接着,我们定义了一个名为 "redirect" 的方法,用于根据设备类型跳转路由。如果在客户端中调用该方法,我们就直接跳转到指定的 URL;如果在服务器端中调用该方法,我们就使用上下文对象(context)的 redirect 方法来跳转路由。 最后,我们将插件作为 Nuxt.js 的插件进行注册: ```javascript // nuxt.config.js export default { plugins: ['~/plugins/device.js'] } ``` 现在,我们就可以在页面中使用该插件了。例如,我们可以编写一个页面组件来测试: ```html <!-- pages/index.vue --> <template> <div> <h1>首页</h1> <button @click="goToAbout">跳转到关于页</button> </div> </template> <script> export default { methods: { goToAbout() { this.$device.redirect('/about') } } } </script> ``` 在上面的代码中,我们定义了一个按钮,当用户点击该按钮时,就会调用 $device.redirect 方法来跳转到 "/about" 路由。如果是在移动设备上访问,就会跳转到 "/m/about" 路由。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值