分享两个手机访问pc网站自动跳转手机端网站代码


Posted in Javascript onDecember 24, 2020

4G降临,移动网站已经一发不可收拾,pc端和移动端官网并存。如何让别人访问你的pc端的官网直接跳转到移动端的网站呢?各位看官,小二上代码!来了!

常用的访问pc自动跳转到移动页面的代码

(function() {
      if (/Android|webOS|iPhone|iPad|Windows Phone|iPod|BlackBerry|SymbianOS|Nokia|Mobile|Opera Mini/i.test(navigator.userAgent)) {
        var siteName = window.location.pathname;
        if (url.indexOf("?pc") < 0) {
          try {
				if (typeof siteName !== "undefined") {
            	window.location.href = "https://m.3water.com" + siteName
          		} 
          } catch (e) {}
        }
      }
    })();

访问移动端自动跳pc端的代码

;(function() {
  var reWriteUrl = function(url) {
    if (url) {
      var Splits = url.split("/"),
      siteName = window.location.pathname;
      if (typeof siteName !== "undefined") {
        return "https://3water.com" + siteName
      }
    }
  };
  if (!/Android|webOS|iPhone|iPad|Windows Phone|iPod|BlackBerry|SymbianOS|Nokia|Mobile|Opera Mini/i.test(navigator.userAgent)) {
    var url = window.location.href;
    var pathname = window.location.pathname;
    if (url.indexOf("?m") < 0) {
      try {
        window.location.href = reWriteUrl(url)
      } catch(e) {}
    }
  }
})();

判断浏览器是否为手机端

<script type="text/javascript">
(function(){var reWriteUrl=function(url){if(url){var Splits=url.split("/"),siteName=window.location.pathname;if(typeof siteName!=="undefined"){return"https://m.3water.com"+siteName}}};if(/Android|webOS|iPhone|iPad|Windows Phone|iPod|BlackBerry|SymbianOS|Nokia|Mobile/i.test(navigator.userAgent)){var url=window.location.href;var pathname=window.location.pathname;if(url.indexOf("?pc")<0){try{window.location.href=reWriteUrl(url)}catch(e){}}}})();
</script>

判断浏览器是否为pc端,是就跳到pc页面

<script>
var browser1 = {
	 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/i) || !!u.match(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/), //是否为移动终端
	   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, //是否为iPhone或者QQHD浏览器
	   iPad: u.indexOf('iPad') > -1, //是否iPad
	   webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部
	  };
	 } (),
	 language: (navigator.browserLanguage || navigator.language).toLowerCase()
	}

if(browser1.versions.mobile==false&&browser1.versions.ios==false&&browser1.versions.android==false&&browser1.versions.iPhone==false &&browser1.versions.iPad==false){
		//location.href = location.href.replace("m.","www.");//如果不是手机打开,则跳转到pc页面
		alert("pc");
	}

</script>

以下是补充可以参考

jQuery判断浏览器是移动端还是电脑端自动跳转

一个段小代码,同一个网站针对移动端查看和电脑端查看跳转不同的页面。
首先加载jQuery文件。

$(function(){ 
 var MobileUA = (function() { 
  var ua = navigator.userAgent.toLowerCase(); 
 
  var mua = { 
   IOS: /ipod|iphone|ipad/.test(ua), //iOS 
   IPHONE: /iphone/.test(ua), //iPhone 
   IPAD: /ipad/.test(ua), //iPad 
   ANDROID: /android/.test(ua), //Android Device 
   WINDOWS: /windows/.test(ua), //Windows Device 
   TOUCH_DEVICE: ('ontouchstart' in window) || /touch/.test(ua), //Touch Device 
   MOBILE: /mobile/.test(ua), //Mobile Device (iPad) 
   ANDROID_TABLET: false, //Android Tablet 
   WINDOWS_TABLET: false, //Windows Tablet 
   TABLET: false, //Tablet (iPad, Android, Windows) 
   SMART_PHONE: false //Smart Phone (iPhone, Android) 
  }; 
 
  mua.ANDROID_TABLET = mua.ANDROID && !mua.MOBILE; 
  mua.WINDOWS_TABLET = mua.WINDOWS && /tablet/.test(ua); 
  mua.TABLET = mua.IPAD || mua.ANDROID_TABLET || mua.WINDOWS_TABLET; 
  mua.SMART_PHONE = mua.MOBILE && !mua.TABLET; 
 
  return mua; 
 }()); 
 
 //SmartPhone 
 if (MobileUA.SMART_PHONE) { 
  // 移动端链接地址 
   
  document.location.href = 'http://www.aaa.com/wap/index.html'; 
 } 
});

 需要手机端也网页的数据同步

<script type="text/javascript">

(function(){var ua=navigator.userAgent.toLowerCase();var bIsIpad=ua.match(/ipad/i)=="ipad";var bIsIphoneOs=ua.match(/iphone os/i)=="iphone os";var bIsAndroid=ua.match(/android/i)=="android";var bIsWM=ua.match(/windows mobile/i)=="windows mobile";if(bIsIpad||bIsIphoneOs||bIsAndroid||bIsWM){window.location.href="http://m.3water.com/android/game/826.html"}})();

</script>

第二种方法:

<SCRIPT LANGUAGE="JavaScript">
function mobile_device_detect(url)
{ 
 var thisOS=navigator.platform; 
 var os=new Array("iPhone","iPod","iPad","android","Nokia","SymbianOS","Symbian","Windows Phone","Phone","Linux armv71","MAUI","UNTRUSTED/1.0","Windows CE","BlackBerry","IEMobile");
 for(var i=0;i<os.length;i++)
 { 
 if(thisOS.match(os[i]))
 { 
 window.location=url;
 } 
 }
 
 //因为相当部分的手机系统不知道信息,这里是做临时性特殊辨认
 if(navigator.platform.indexOf('iPad') != -1)
 {
 window.location=url;
 }
 
 //做这一部分是因为Android手机的内核也是Linux
 //但是navigator.platform显示信息不尽相同情况繁多,因此从浏览器下手,即用navigator.appVersion信息做判断
 var check = navigator.appVersion;
 
 if( check.match(/linux/i) )
  {
 //X11是UC浏览器的平台 ,如果有其他特殊浏览器也可以附加上条件
 if(check.match(/mobile/i) || check.match(/X11/i))
   {
 window.location=url;
 } 
 }
 
 //类in_array函数
 Array.prototype.in_array = function(e)
 {
 for(i=0;i<this.length;i++)
 {
 if(this[i] == e)
 return true;
 }
 return false;
 }
} 
mobile_device_detect("http://***.***.com");
</SCRIPT>

备注这里的
mobile_device_detect("http://***.***.com");//里面的地址填的就是您的移动端的网站地址呦。

Javascript 相关文章推荐
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
Feb 26 Javascript
js实现checkbox全选和反选示例
May 01 Javascript
使用Sticker.js实现贴纸效果
Jan 28 Javascript
JavaScript对象数组排序函数及六个用法
Dec 23 Javascript
教你一步步用jQyery实现轮播器
Dec 18 Javascript
jQuery实现立体式数字动态增加(animate方法)
Dec 21 Javascript
微信小程序教程系列之设置标题栏和导航栏(7)
Jun 29 Javascript
Angular directive递归实现目录树结构代码实例
May 05 Javascript
详解使用vue-cli脚手架初始化Vue项目下的项目结构
Mar 08 Javascript
vue 实现Web端的定位功能 获取经纬度
Aug 08 Javascript
使用p5.js实现动态GIF图片临摹重现
Oct 23 Javascript
react 不用插件实现数字滚动的效果示例
Apr 14 Javascript
js判断登录与否并确定跳转页面的方法
Jan 30 #Javascript
jQuery知识点整理
Jan 30 #Javascript
浅谈jquery回调函数callback的使用
Jan 30 #Javascript
jQuery修改class属性和CSS样式整理
Jan 30 #Javascript
javascript中AJAX用法实例分析
Jan 30 #Javascript
JavaScript基础函数整理汇总
Jan 30 #Javascript
JS解析XML实例分析
Jan 30 #Javascript
You might like
星际原理概述
2020/03/04 星际争霸
一贴学会PHP 新手入门教程
2009/08/03 PHP
php 一元分词算法
2009/11/30 PHP
php数组函数序列之asort() - 对数组的元素值进行升序排序,保持索引关系
2011/11/02 PHP
PHP单例模式是什么 php实现单例模式的方法
2016/05/14 PHP
PHP以json或xml格式返回请求数据的方法
2018/05/31 PHP
Javascript学习笔记1 数据类型
2010/01/11 Javascript
基于jQuery的的一个隔行变色,鼠标移动变色的小插件
2010/07/06 Javascript
鼠标右击事件代码(asp.net后台)
2011/01/27 Javascript
JavaScript获取页面上某个元素的代码
2011/03/13 Javascript
js确定对象类型方法
2012/03/30 Javascript
jquery live()重复绑定的解决方法介绍
2014/01/03 Javascript
JS获取各种宽度、高度的简单介绍
2014/12/19 Javascript
jQuery使用fadein方法实现渐出效果实例
2015/03/27 Javascript
jQuery Easyui 验证两次密码输入是否相等
2016/05/13 Javascript
JS封装的自动创建表格的实现代码
2016/06/15 Javascript
Vue.js学习之过滤器详解
2017/01/22 Javascript
Node.js 异步异常的处理与domain模块解析
2017/05/10 Javascript
node.js-v6新版安装具体步骤(分享)
2017/09/06 Javascript
基于bootstrop常用类总结(推荐)
2017/09/11 Javascript
jquery一键控制checkbox全选、反选或全不选
2017/10/16 jQuery
vue-cli实现多页面多路由的示例代码
2018/01/30 Javascript
Vue多环境代理配置方法思路详解
2019/06/21 Javascript
node.js使用mongoose操作数据库实现购物车的增、删、改、查功能示例
2019/12/23 Javascript
微信小程序实现弹框效果
2020/05/26 Javascript
使用Python爬了4400条淘宝商品数据,竟发现了这些“潜规则”
2018/03/23 Python
Django后台获取前端post上传的文件方法
2018/05/28 Python
Python 实现大整数乘法算法的示例代码
2019/09/17 Python
Django使用消息提示简单的弹出个对话框实例
2019/11/15 Python
记一次pyinstaller打包pygame项目为exe的过程(带图片)
2020/03/02 Python
python怎么对数字进行过滤
2020/07/05 Python
python日志通过不同的等级打印不同的颜色(示例代码)
2021/01/13 Python
春秋航空官方网站:Spring Airlines
2017/09/27 全球购物
高分子材料与工程专业推荐信
2013/12/01 职场文书
运动员口号
2014/06/09 职场文书
会议开幕致辞怎么写
2016/03/03 职场文书