最近做了2个页面,一个是PC端,一个是移动端,由于现在移动设备的普及,所以这里就要考虑到,当人们在移动端访问PC端页面的时候,我们如何给用户进行一个判断,然后跳转到对应的页面。
我在网上查了一下,一般分为两种:
1:百度的site app — uaredirect.js
<span style="font-family:Microsoft YaHei;"> <script src="http://siteapp.baidu.com/static/webappservice/uaredirect.js" type="text/javascript"></script>
<script type="text/javascript">uaredirect("http://www.baidu.com");</script></span>
把上述代码放到页面的底部即可,上面uaredirect里面的内容换上对应的网址即可。
2:使用JS获取navigator对象,进行判断和跳转
<span style="font-family:Microsoft YaHei;"> <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 = 'http://***';
} else {
window.location = 'http://***';
}
}
browserRedirect();
</script></span>
3:最后我直接用jQuery ajax返回当前页面html片段
<span style="font-family:Microsoft YaHei;"> <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.1.min.js"></script>
<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";
//alert(bIsIpad+":"+bIsIphoneOs+":"+bIsMidp+":"+bIsUc7+":"+bIsUc+":"+bIsAndroid+":"+bIsCE+":"+bIsWM);
if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
$.ajax({
type:'GET',
url:'**.**',
dataType:'html',
success:function(html){
$('body').html(html);
}
});
} else {
$.ajax({
type:'GET',
url:'**.**',
dataType:'html',
success:function(html){
$('body').html(html);
}
});
}
}
browserRedirect();
</script></span>