在网上看到很多这样类似的代码,但是有的很复杂,或者有的没有判断完全,上次经理去见完客户回来讲,使用苹果浏览打开pc端(pc已经做了识别跳转)会自动跳转到移动端的网页去,后来经测试才发现
document.writeln(" 是否为移动终端: "+browser.versions.mobile+"</br>"); //打印出来 true
所以在完整版的代码中 第一层if 判断一直是true
以上的原因是因为,网上流传的判断为:
mobile: !! u.match(/AppleWebKit.*Mobile.*/) || !! u.match(/AppleWebKit/), //是否为移动终端
判断不完整才会造成这种原因。
下面小编为大家分享网站常用的判断代码
pc自动跳移动端
(function() { if (/Android|webOS|iPhone|iPad|Windows Phone|iPod|BlackBerry|SymbianOS|Nokia|Mobile|Opera Mini/i.test(navigator.userAgent)) { var siteName = window.location.pathname; if (url.indexOf("") < 0) { try { if (typeof siteName !== "undefined") { window.location.href = "https://m.jb51.net" + siteName } } catch (e) {} } } })();
移动端自动跳pc端
;(function() { var reWriteUrl = function(url) { if (url) { var Splits = url.split("/"), siteName = window.location.pathname; if (typeof siteName !== "undefined") { return "https://www.jb51.net" + siteName } } }; if (!/Android|webOS|iPhone|iPad|Windows Phone|iPod|BlackBerry|SymbianOS|Nokia|Mobile|Opera Mini/i.test(navigator.userAgent)) { var url = window.location.href; var pathname = window.location.pathname; if (url.indexOf("") < 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, //是否为移动终端
测试程序代码
var browser = { versions: function() { var u = 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;)"语言版本: "+browser.language+"</br>"); document.writeln(" 是否为移动终端: "+browser.versions.mobile+"</br>"); document.writeln(" ios终端: "+browser.versions.ios+"</br>"); document.writeln(" android终端: "+browser.versions.android+"</br>"); document.writeln(" 是否为iPhone: "+browser.versions.iPhone+"</br>"); document.writeln(" 是否iPad: "+browser.versions.iPad+"</br>"); document.writeln(navigator.userAgent+"</br>");
完整版,运用于项目代码
/* * * 判断PC端与WAP端 */ var mobile_bs = { versions: function() { var u = 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;)"移动端网址"; } };
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!