當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JS 判断是否是手机端并跳转操作
生活随笔
收集整理的這篇文章主要介紹了
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
?
更多專業前端知識，請上 【猿2048】www.mk2048.com
總結
以上是生活随笔為你收集整理的JS 判断是否是手机端并跳转操作的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Vue.js 相关知识（动画）
- 下一篇： JSON 使用 教程