分享两个手机访问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 相关文章推荐
jQuery 对象中的类数组操作
Apr 27 Javascript
javascript iframe内的函数调用实现方法
Jul 19 Javascript
向当前style sheet中插入一个新的style实现方法
Apr 01 Javascript
一个js导致的jquery失效问题的解决方法
Nov 27 Javascript
jquery中的查找parents与closest方法之间的区别
Dec 02 Javascript
JS运动基础框架实例分析
Mar 03 Javascript
原生js页面滚动延迟加载图片
Dec 20 Javascript
JavaScript如何实现组合列表框中元素移动效果
Mar 01 Javascript
jQuery 添加样式属性的优先级别方法(推荐)
Jun 08 jQuery
webpack教程之webpack.config.js配置文件
Jul 05 Javascript
在vue中v-bind使用三目运算符绑定class的实例
Sep 29 Javascript
layui 数据表格 根据值(1=业务,2=机构)显示中文名称示例
Oct 26 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
如何选购合适的收音机
2021/03/01 无线电
有关 PHP 和 MySQL 时区的一点总结
2008/03/26 PHP
PHP按行读取文件时删除换行符的3种方法
2014/05/04 PHP
jquery星级插件、支持页面中多次使用
2012/03/25 Javascript
基于JavaScript实现继承机制之调用call()与apply()的方法详解
2013/05/07 Javascript
JS保留两位小数,多位小数的示例代码
2014/01/07 Javascript
基于编写jQuery的无缝滚动插件
2014/08/02 Javascript
Javascript限制网页只能在微信内置浏览器中访问
2014/11/09 Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(二)之数据支持json字符串、list集合
2016/08/11 Javascript
js仿支付宝多方框输入支付密码效果
2016/09/27 Javascript
JS框架之vue.js(深入三:组件1)
2016/09/29 Javascript
微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例
2016/10/13 Javascript
JavaScript制作弹出层效果
2016/12/02 Javascript
JavaScript学习笔记--常用的互动方法
2016/12/07 Javascript
JS 实现 ajax 异步浏览器兼容问题
2017/01/21 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
2017/07/24 Javascript
React-Native做一个文本输入框组件的实现代码
2017/08/10 Javascript
基于node.js的fs核心模块读写文件操作(实例讲解)
2017/09/10 Javascript
微信小程序开发之IOS和Android兼容的问题
2017/09/26 Javascript
vue 实现 ios 原生picker 效果及实现思路解析
2017/12/06 Javascript
vuejs实现标签选项卡动态更改css样式的方法
2018/05/31 Javascript
Vue2.0 v-for filter列表过滤功能的实现
2018/09/07 Javascript
微信小程序按顺序同步执行的两种方式
2019/12/20 Javascript
python中django框架通过正则搜索页面上email地址的方法
2015/03/21 Python
详解在Python中处理异常的教程
2015/05/24 Python
Selenium 模拟浏览器动态加载页面的实现方法
2018/05/16 Python
如何实现在jupyter notebook中播放视频(不停地展示图片)
2020/04/23 Python
Pytest如何使用skip跳过执行测试
2020/08/13 Python
windows+vscode安装paddleOCR运行环境的步骤
2020/11/11 Python
伦敦的高级牛仔布专家:Trilogy
2018/08/06 全球购物
澳大利亚有机化妆品网上商店:The Well Store
2020/02/20 全球购物
升职自荐信怎么写
2015/03/05 职场文书
2015年国庆节广播稿
2015/08/19 职场文书
导游词之天津古文化街
2019/11/09 职场文书
十大最帅动漫男主 碓冰拓海上榜,第一是《灌篮高手》男主角
2022/03/18 日漫
Win10鼠标轨迹怎么开 Win10显示鼠标轨迹方法
2022/04/06 数码科技