怎样判断手机端和电脑端自动跳转到各自的页面

判断是否pc端还是wap，也可以单位写两个js文件放到wap站head里，详细步骤：

1、二者大不相同，所以用加载不同的css等方式不好实现，而我们加用下面的JS代码后，问题就变得很简单。代码1：

<script type="text/javascript">

<!--

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

varsystem={

win:false,

mac:false,

xll:false

}

//检测平台

varp=navigator.platform

system.win=p.indexOf("Win")==0

system.mac=p.indexOf("Mac")==0

system.x11=(p=="X11")||(p.indexOf("Linux")==0)

//跳转语句，如果是手机访问就自动跳转到wap.baidu.com页面

if(system.win||system.mac||system.xll){

}else{

window.location.href="手机站链接"

}

-->

</script>

否则打开网站默认页面。

2、代码2：

<script type="text/javascript">

functionbrowserRedirect(){

varsUserAgent=navigator.userAgent.toLowerCase()

varbIsIpad=sUserAgent.match(/ipad/i)=="ipad"

varbIsIphoneOs=sUserAgent.match(/iphoneos/i)=="iphoneos"

varbIsMidp=sUserAgent.match(/midp/i)=="midp"

varbIsUc7=sUserAgent.match(/rv:1.2.3.4/i)=="rv:1.2.3.4"

varbIsUc=sUserAgent.match(/ucweb/i)=="ucweb"

varbIsAndroid=sUserAgent.match(/android/i)=="android"

varbIsCE=sUserAgent.match(/windowsce/i)=="windowsce"

varbIsWM=sUserAgent.match(/windowsmobile/i)=="windowsmobile"

if(bIsIpad||bIsIphoneOs||bIsMidp||bIsUc7||bIsUc||bIsAndroid||bIsCE||bIsWM){

window.location.href='手机站链接'

}else{

window.location='PC站链接'

}

}

browserRedirect()

</script>

3、引入代码后系统可以自动判断是手机平板等移动设备还是PC客户端，而打开不同的页面，而展示我们设置的相应页面，交互友好，更有利于留住客户，wbapp：

4、PC端：

自动识别跳转，主要有以下几种方法可以尝试：

1、在网站head标签里加跳转语句

要实现网站根据访问设备自动识别展示手机站或PC站这个功能，需要以下几个步骤：

（1）、你得有一个PC端，在电脑上访问的官方网站，比如：www.baidu.com。

（2）、你需要重新制作一个移动端的手机网站，比如：m.baidu.com。

（3）、在PC端的网站上加上一段代码，每个页面都需要加上，放在PC端网站head标签里面，代码如下：

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

var system = {

win: false,

mac: false,

xll: 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)

//跳转语句

if (!(system.win || system.mac || system.xll)) {//转向电脑界面

window.location.href = “http://m.baidu.com”

}

（4）、进入域名解析系统，做一个别名cname解析，比如：你手机网站制作公司给的地址123.域名.com解析到m.baidu.com域名解析系统。

2、根据移动终端和浏览器版本信息判定的语法

还有一些站长或SEO可能会考虑到移动终端的版本和浏览器版本信息，对此，肥猫科技也为大家整理了一段比较有效的代码，如下所示：

<script type="text/javascript">

var browser={

  versions:function(){

         var u = navigator.userAgent, app = navigator.appVersion

         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/), //是否为移动终端

              ios: !!u.match(/i[^]+( U)? CPU.+Mac OS X/), //ios终端

              android: u.indexOf('Android') >-1 || u.indexOf('Linux') >-1, //android终端或者uc浏览器

              iPhone: u.indexOf('iPhone') >-1 || (u.indexOf('Mac') >-1 &&u.indexOf('Macintosh') <0), //是否为iPhone或者QQHD浏览器

              iPad: u.indexOf('iPad') >-1, //是否iPad

              webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部

          }

       }(),

       language:(navigator.browserLanguage || navigator.language).toLowerCase()

}

if (browser.versions.ios||browser.versions.android||browser.versions.iPhone||browser.versions.iPad) {

self.location=http://www.baidu.com

}

</script>

3、自动识别手机页面、iPad页面和wap页面

可以根据不同的终端类型适当的改变正则表达式，这段代码添加到需要识别的网页，会根据客户端的类型自动跳转到手机页、平板页或其他移动设备页面，非常的灵活！

<script type="text/javascript">

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|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){

              window.location.href="http://www.baidu.com/m"

          }else if(/iPad/i.test(navigator.userAgent)){

              window.location.href="http://www.baidu.com/pad"

          }else{

              window.location.href="http://www.baidu.com/wap"

          }

      }catch(e){}

  }

}

</script>

4、使用PHP语言来识别

对于一些精通PHP语言的博友来说，也可以通过PHP语法来实现，比如以下的写法：

//设定Mobile的定义

$mobileAgent = array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire")

//读取用户的浏览器资料

$browser = $_SERVER['HTTP_USER_AGENT']

$isMobile = false

//检查开始

foreach($mobileAgent as $search){

  if(stristr($browser,$search)!=false){

      $isMobile = true

      //echo $search

      //程式码(转址)

      header("Location: http://www.baidu.com/m/index.html")

      //停止运行程序

      exit

  }

}

?>

5、做个自动识别的效果

经过多次测试，我们也可以做个自动识别的效果，方法很简单，在你需要自动跳转的页面加入以下代码：

<script type="text/javascript">

var mobileAgent = new Array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire")

var browser = navigator.userAgent.toLowerCase()

var isMobile = false

for (var i=0i<mobileAgent.lengthi++){ if (browser.indexOf(mobileAgent[i])!=-1){ isMobile = true

//alert(mobileAgent[i])

location.href = 'http://siteapp.baidu.com/webapp/mahaixiang.cn#m/http://mahaixiang.cn/'

break} }

</script>

6、自动识别移动端适配跳转网址的代码

手机版的网站需要简单，以文字为主，才能很好的兼容，可以在网站的首页设置一个程序来判断用户是手机端还是电脑，如果是手机端，直接中转到手机端，如果是电脑端，直接中转到电脑端（大家也可以使用百度提高的百度移动搜索开放适配服务。

对此，大家可以在网站的首页插入入下代码：

<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=B页面　

}

}　

browserRedirect()　

</script>

<script type="text/javascript">uaredirect("<A href='http://www.baidu.com/wap/","http://www.baidu.com/index.html")http://www.baidu.com/wap/","http://www.baidu.com/index.html")

</script>

在肥猫科技看来，PC版网页自动识别手机客户端并跳转，用js进行判断是否手机客户端进行跳转最好，特别是静态网页，把这个过程通过js的方式放在用户客户端执行，可以大大减少服务器端额外处理的压力，但是有时需要通过在服务器端进行判断的情况除外。

---