js判断PC端与移动端跳转
在网上看到很多这样类似的代码,但是有的很复杂,或者有的没有判断完全,上次经理去见完客户回来讲,使用苹果浏览打开pc端(pc已经做了识别跳转)会自动跳转到移动端的网页去,后来经测试才发现
document.writeln("是否为移动终端:"+browser.versions.mobile+""); //打印出来true
所以在完整版的代码中第一层if判断一直是true
以上的原因是因为,网上流传的判断为:
mobile:!!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/),//是否为移动终端
判断不完整才会造成这种原因。
下面毛票票小编为大家分享网站常用的判断代码
pc自动跳移动端
(function(){ if(/Android|webOS|iPhone|iPad|WindowsPhone|iPod|BlackBerry|SymbianOS|Nokia|Mobile|OperaMini/i.test(navigator.userAgent)){ varsiteName=window.location.pathname; if(url.indexOf("?pc")<0){ try{ if(typeofsiteName!=="undefined"){ window.location.href="https://m.jb51.net"+siteName } }catch(e){} } } })();
移动端自动跳pc端
;(function(){ varreWriteUrl=function(url){ if(url){ varSplits=url.split("/"), siteName=window.location.pathname; if(typeofsiteName!=="undefined"){ return"https://www.nhooo.com"+siteName } } }; if(!/Android|webOS|iPhone|iPad|WindowsPhone|iPod|BlackBerry|SymbianOS|Nokia|Mobile|OperaMini/i.test(navigator.userAgent)){ varurl=window.location.href; varpathname=window.location.pathname; if(url.indexOf("?m")<0){ try{ window.location.href=reWriteUrl(url) }catch(e){} } } })();
正确的判断应该为:
mobile:!!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/)&&u.indexOf('QIHU')&&u.indexOf('QIHU')>-1&&u.indexOf('Chrome')<0,//是否为移动终端
测试程序代码
varbrowser={ versions:function(){ varu=navigator.userAgent; return{ trident:u.indexOf('Trident')>-1, presto:u.indexOf('Presto')>-1, webKit:u.indexOf('AppleWebKit')>-1, gecko:u.indexOf('Gecko')>-1&&u.indexOf('KHTML')==-1, mobile:!!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/)&&u.indexOf('QIHU')&&u.indexOf('QIHU')>-1&&u.indexOf('Chrome')<0, ios:!!u.match(/\(i[^;]+;(U;)?CPU.+MacOSX/), android:u.indexOf('Android')>-1||u.indexOf('Linux')>-1, iPhone:u.indexOf('iPhone')>-1||u.indexOf('Mac')>-1, iPad:u.indexOf('iPad')>-1, webApp:u.indexOf('Safari')==-1 } }(), language:(navigator.browserLanguage||navigator.language).toLowerCase() }; document.writeln("语言版本:"+browser.language+""); document.writeln("是否为移动终端:"+browser.versions.mobile+""); document.writeln("ios终端:"+browser.versions.ios+""); document.writeln("android终端:"+browser.versions.android+""); document.writeln("是否为iPhone:"+browser.versions.iPhone+""); document.writeln("是否iPad:"+browser.versions.iPad+""); document.writeln(navigator.userAgent+"");
完整版,运用于项目代码
/* * *判断PC端与WAP端 */ varmobile_bs={ versions:function(){ varu=navigator.userAgent; 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.*/)||!!u.match(/AppleWebKit/)&&u.indexOf('QIHU')&&u.indexOf('QIHU')>-1&&u.indexOf('Chrome')<0,//是否为移动终端 ios:!!u.match(/\(i[^;]+;(U;)?CPU.+MacOSX/),//ios终端 android:u.indexOf('Android')>-1||u.indexOf('Linux')>-1,//android终端或者uc浏览器 iPhone:u.indexOf('iPhone')>-1||u.indexOf('Mac')>-1,//是否为iPhone或者QQHD浏览器 iPad:u.indexOf('iPad')>-1,//是否iPad webApp:u.indexOf('Safari')==-1//是否web应该程序,没有头部与底部 } }() }; if(mobile_bs.versions.mobile){ if(mobile_bs.versions.android||mobile_bs.versions.iPhone||mobile_bs.versions.iPad||mobile_bs.versions.ios){ window.location.href="移动端网址"; } };
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持毛票票!