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>

</head>

<body>

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>

常用跳转代码

// 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>

<!--

//平台、设备和操作系统

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>

腾讯跳转

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>

<!--

//平台、设备和操作系统

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)

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 判断是否是手机端并跳转操作相关推荐

JS前端开发判断是否是手机端并跳转操作（小结）
转载于:http://www.xker.com/page/e2014/0325/131654.html 常用跳转代码以下代码为常用来判断访问者的访问设备的类型来进行相应的跳转 <script ...
JS判断设备是手机端还是PC端，并加载不同的css/js文件
最近公司有个页面需要做pc端和手机端的页面自适应,即手机打开是指定的样式,pc打开则是pc指定的样式,样式是前端ui已经设计好了的. 所以这里需要通过Navigator userAgent 属性判断浏 ...
php判断是否手机,PHP如何判断是否为手机端
本文主要和大家分享PHP如何判断是否为手机端的方法实例,希望能帮助到大家.PHP判断是否为手机端的方法 private function ismobile() { // 如果有HTTP_X_WAP_P ...
java 判断是否手机浏览器_js 判断是否是手机端的浏览器
// 判断是否是手机端浏览器 function getBrowser(){ var ua = navigator.userAgent.toLowerCase(); var btypeInfo = (u ...
php自动识别pc和手机端并跳转,JS如何实现网站中PC端和手机端自动识别并跳转对应的代码...
1. 代码场景: 描述:在项目中,一般我们会使用响应式布局的方式或者借助bootstrap等插件来做响应式的网站.但是根据业务的需求,手机端可能会在功能上精简很多,我们也会写两套代码,分别用来实现P ...
判断客户端是手机端微信端pc端
判断客户端 if(strpos($_SERVER["HTTP_USER_AGENT"],'Mobile') || strpos($_SERVER['HTTP_USER_AGENT' ...
判断浏览器是手机端还是pc端以及判断安卓还是iOS
// 方法一 function IsPC() {var userAgentInfo = navigator.userAgent; var Agents = ["Android", ...
html电脑显示手机隐藏,右侧悬浮菜单悬浮窗 css+html css自动判断PC显示手机端隐藏...
感觉还不错,只是部署到博客不太搭配(颜色太鲜艳了),用css加了个设备判断,电脑端显示.手机端隐藏.1221px 界点预览: html代码: 在线图床业务平台积分获取积分素材官方客服官方客服: ...
js判断数据类型（如数组）及数组操作函数
在ES5的时候,js数据类型有6种:Number.String.Boolean.undefined.object.Null. 注:https://blog.csdn.net/u013592575/ar ...

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

JS 判断是否是手机端并跳转操作相关推荐

最新文章

热门文章