【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收藏本页 最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的 ...
随机推荐
- 用php做了下冒泡排序
大学没好好读书,那会没怎么明白冒泡排序是这么回事 早上睡到九点多起来,就在房间看书.听歌,下午吃完饭做了下冒泡排序,现在把代码贡献如下: <?php /** * Created by PhpSt ...
- 【GOF23设计模式】责任链模式
来源:http://www.bjsxt.com/ 一.[GOF23设计模式]_责任链模式.公文审批.供应链系统的采购审批.异常链.过滤器和拦截器调用过程 package com.test.chainO ...
- Play 内置模板标签(1.2.3版本)http://www.anool.net/?p=617
a标签: 用来插入一个连接到控制器方法的html link.如下: #{a @Application.logout()}Disconnect#{/a}模板内容被解析后变成: <a href=&q ...
- CMD和AMD
CMD是国内玉伯在开发SeaJS的时候提出来的,属于CommonJS的一种规范,此外还有AMD,其对于的框架是RequireJS. 二者的异同之处: 二者都是异步(Asynchronuous Modu ...
- JavaScript基础11——js的全局函数
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Vue表单
gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson11 一 vue表单 实在是太简单了,直接来个例子 <!DOC ...
- jquery实现轮播
HTML代码: <div class="ad"> <ul class="slider"> <li><img src=& ...
- SharePoint通过stsadm备份和还原子网站(不是网站集)
大家都知道SharePoint的stsadm命令提供了很多便捷甚至是唯一的操作方法! 这里列出的所有命令:http://www.cnblogs.com/dadongzuo/archive/2013/0 ...
- iOS 在制作framework时候对aggregate的配置
# Sets the target folders and the final framework product.# 如果工程名称和Framework的Target名称不一样的话,要自定义FMKNA ...
- iOS应用程序开发之应用间的跳转(用着微信等第三方分享登陆)
简介 配置和实现 判断应用启动方式 一.简介 最实际项目开发中,我们难免会遇到需要从一个应用跳转到另一个应用的情况.比如微信分享,实际就是一种应用间的跳转.但是有时候我们需要实现自己的两个应用间的跳转 ...