【Javascript Demo】移动端访问PC端网页时跳转到对应的移动端网页
不想通过CSS自适应在PC端和移动端分别显示不同的样式,那么只能通过在移动端访问PC端网页时跳转到对应的移动端网页了,那么怎么跳转呢,网上也有很多文章说明,下面是本人测试有效的方式。
1.效果图
PC端访问显示:

移动端访问显示:

2.实现:
不考虑移动端搜索引擎优化的话,只需要通过JS判断是否移动端,然后确定是否跳转到指定页面就行了,主要JS如下:
//判断是否移动端,如果是则跳转到指定的URL地址
function browserRedirect(url) {
//只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值
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);
}
}
然后在页面引用JS,调用方法就行了:
<script src="../js/wap.js"></script>
<script type="text/javascript">browserRedirect("http://ycdoit.com/test/testmobile.html");</script>
PS:大家可以用PC端和移动端访问测试页面查看效果。
【Javascript Demo】移动端访问PC端网页时跳转到对应的移动端网页的更多相关文章
- 移动端访问PC站点时自动跳转至移动站点
方法一: 百度Site APP的uaredirect.js 实现手机访问,自动跳转 <script src="http://siteapp.baidu.com/static/webap ...
- JS判断是wap端访问网站还是PC端访问,然后进行自动跳转的代码
<script type="text/javascript"> function goPAGE() { if ((navigator.userAgent.match(/ ...
- 手机访问pc版网站自动跳转为手机版页面
1.PC版首页</head>标签前加上以下脚本 <script src="/tools/browser_redirect.ashx"></script ...
- 手机访问pc网站,自动跳转到手机网站
<script type='text/javascript'> var browser = { versions: function () { var u = navigator.user ...
- JavaScript判断移动端及pc端访问不同的网站
JavaScript判断移动端及pc端访问不同的网站 现在很多网站都是分为两个版本,一个pc端的一个移动端的(响应式除外),针对这两个版本,就需要对访问的设备进行判断,如果是pc,就直接访问pc网站, ...
- 如何使用Charles让手机访问PC自定义域名?
需求:移动端访问PC上的自定义域名,如在Nginx上配置的域名 如vv.zzcloud.com这个域名在pc上是通过host映射的方式访问,现在需要在手机上访问到这个域名. 工具:Charles代 ...
- SharePoint 如何使自己的网页自动跳转
SharePoint 如何使自己的网页自动跳转 SharePoint自动制作自己的网页跳的很easy,只有在页面上要添加一个Web部分--内容编辑器,对应的js代码就可以. ...
- 测试网页时需要添加等待的情形 (Selenium)
测试网页时需要添加等待的情形: 1. 网页跳转 2. DOM结构发生改变.
- js如何判断用户是在pc端和还是移动端访问
js如何判断用户是在pc端和还是移动端访问 来源:A5技术交流 作者:wofa 时间:2014-04-25收藏本页 最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的 ...
随机推荐
- Activity按下2次退出和获取当前时间
先看下onBackPressed和onKeyDown的区别 在Android上有两种方法来获取该按钮的事件 1.直接获取按钮按下事件,此方法兼容Android 1.0到Android 2.1 也是常规 ...
- wrong requestcode when using startActivityForResult
You are calling startActivityForResult() from your Fragment. When you do this, the requestCode is ch ...
- pygame for python3.3
pygame的更新慢的令人发指,我最初使用的python是3.4版本的,无何奈何pygame不支持3.4,甚至官网只有3.2版本的.我于是将各种版本试了一遍,出现各种问题,同时我比较钟爱3.x版本,最 ...
- 在Windows下编写并运行第一个ASP.NET 5 Preview Web API程序
2015年07月21日在微软中国MSDN的官方微博上得知Visual Studio 2015正式版完美发布. 抱着尝鲜的心态下载了Visual Studio社区版本. 在这个首发的版本里面,我们可以看 ...
- C#中List<T>对象的深度拷贝问题
一.List<T>对象中的T是值类型的情况(int 类型等) 对于值类型的List直接用以下方法就可以复制: List<T> oldList = new List<T&g ...
- jquery实现页面控件拖动效果js代码
;(function($) { var DragPanelId = "divContext"; var _idiffx = 0; var _idiffy = 0; var _Div ...
- VS2010运行正常的控制台程序在VS2015中出现乱码的解决方法
以前在Visual Stuido 2010中运行正常的控制台程序,在Visual Studio 2015中出现乱码,找到<Visual Studio 2015的坑:中文字符串编译后成乱码> ...
- Spring(四)Bean注入方试
一.构造方法注入 定义:通过构造函数来完成依赖关系的设定 优缺点: 在构造对象的同时,完成依赖关系的建立 如果关联的对象很多,那和不得不在构造方法上加入过多的参数 基中有index:如果指定索引从0开 ...
- Mac下安装Django
用到一个Python写的后台服务,需要用到Django,参考Django安装文档,配置过程如下: 1.下载一个用来安装和管理Python包的工具“pip”; 2.下载完成后,运行安装脚本,注意需要管理 ...
- Java 实现多线程的三种方式
import java.util.concurrent.Callable; import java.util.concurrent.FutureTask; public class Main { pu ...