用JavaScript实现网站自动跳转电脑PC端与手机端不同页面

来源页面

前天，有一个网友希望在其微擎系统跳转的时候实现鉴别用户不同的客户端，比如电脑PC端和手机端，实现不同的页面跳转。对于之前老蒋有给其设置过PC端网站然后检测手机访问的时候跳转到WAP网站的案例，对于这个分两个流量转出的效果只能去搜索解决方法。

网上提供的方法还是很多的，但是经过测试能兼容较多系统的可以用这个方法实现。

<script type="text/javascript">
function browserRedirect() {
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 || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
window.location.href= '手机端跳转页面URL';
} else {
window.location= 'PC端跳转页面URL';
}
}
browserRedirect();
</script>

我们可以直接将上面的JS代码添加到访问页面头部或者单独设置一个页面，然后设置我们需要跳转的PC和手机端URL或者页面。

方法2：（来源）

<script type="text/javascript">
  (function() {
if(/s=noRedirect/i.test(location.search)) return;
  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))) {
  try {
  if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
  window.location.href = "http://手机版地址";
  } else if(/iPad/i.test(navigator.userAgent)) {
  window.location.href = "电脑版地址";
  }
  } catch(e) {}
  }   
  })();
  if(navigator.platform.indexOf("Mac") > -1) document.documentElement.classList.add("ua-mac");
</script>

手机访问pc端自动跳转到手机版代码

来源地址

<script type="text/javascript">
function browserRedirect(url) {
var sUserAgent = navigator.userAgent.toLowerCase();
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 (bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM){
  window.location.replace(url);              
}
}
browserRedirect("手机链接");
</script>

方法2：（来源）

<!--加载手机端-->
<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)){}else{}}catch(e){}}}}
</script>