JS判断mobile和pc

最新推荐文章于 2024-05-30 15:47:51 发布
转载 最新推荐文章于 2024-05-30 15:47:51 发布 · 552 阅读 · 0

本文介绍了一种使用JavaScript来判断用户是通过移动设备还是PC访问网站的方法，并根据不同的访问方式跳转到相应的页面。


PC版：
var browser = {
       versions : function() {
        var u = navigator.userAgent, app = navigator.appVersion;
        return {//移动终端浏览器版本信息                                                             
       mobile : (!!u.match(/AppleWebKit.*Mobile/) || !!u.match(/Windows Phone/) || !!u.match(/Android/) || !!u.match(/MQQBrowser/)) && !u.match(/iPad/)//是否为移动终端                                
       };
       }()
       }
        if(!browser.versions.mobile){
              alert( "pc or pad");
       } else{
           window.location.href= "http://localhost:8090/m";
       }
Mobile版：
var browser = {
       versions : function() {
        var u = navigator.userAgent, app = navigator.appVersion;
        return {//移动终端浏览器版本信息                                                             
       mobile : (!!u.match(/AppleWebKit.*Mobile/) || !!u.match(/Windows Phone/) || !!u.match(/Android/) || !!u.match(/MQQBrowser/)) && !u.match(/iPad/)//是否为移动终端                                
       };
       }()
       }
        if(browser.versions.mobile){
              alert( "phone");
       } else{
           window.location.href= "http://localhost:8080";
       }
PC版：
var browser = {
       versions :  function() {
         var u = navigator.userAgent, app = navigator.appVersion;
         return { //移动终端浏览器版本信息                                                             
       mobile : (!!u.match(/AppleWebKit.*Mobile/) || !!u.match(/Windows Phone/) || !!u.match(/Android/) || !!u.match(/MQQBrowser/)) && !u.match(/iPad/) //是否为移动终端                                
       };
       }()
       }
         if(!browser.versions.mobile){
              alert(  "pc or pad");
       }  else{
           window.location.href=  "http://localhost:8090/m";
       }
Mobile版：
var browser = {
       versions :  function() {
         var u = navigator.userAgent, app = navigator.appVersion;
         return { //移动终端浏览器版本信息                                                             
       mobile : (!!u.match(/AppleWebKit.*Mobile/) || !!u.match(/Windows Phone/) || !!u.match(/Android/) || !!u.match(/MQQBrowser/)) && !u.match(/iPad/) //是否为移动终端                                
       };
       }()
       }
         if(browser.versions.mobile){
              alert(  "phone");
       }  else{
           window.location.href=  "http://localhost:8080";
       }
JS 动态判断PC和手机浏览器实现代码
10-21
JS动态判断PC和手机浏览器的实现方法主要依赖于JavaScript编程语言，通过识别用户的Navigator User Agent字符串来分辨当前浏览设备。User Agent（用户代理）是客户端用来向服务器和其他设备表明其身份的一串字符串。...
js判断浏览器的环境（pc端，移动端，还是微信浏览器）
10-15
在学习和工作中，使用JavaScript（JS）来判断浏览器的环境是一种常见的需求。这涉及到检测当前用户是通过PC端、移动端还是微信浏览器访问网站。通过不同的环境来调整网站的布局、功能或是用户体验，对于Web开发而言...
详解JS判断页面是在手机端还是在PC端打开的方法
11-26
我们想要的效果是pc文件和mobile文件统一入口，适配不同的设备。 先看看项目的目录： 在index.html里面配置js控制选择那一个文件夹下的文件就可以了。 我们要利用：Navigator 对象，Navigator 对象包含有关浏览器的信息。 index.html很简单，直接上码吧： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" /> <scrip
js 判断mobile
hejias的专栏
01-09 375
js 判断mobile if((navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i))){ console.info(navigator.userAgent); alert('mobile'); }
js判断是否为移动端[Mobile]
DK米晓虎的专栏
07-10 874
function IsMobile() { var ua = navigator.userAgent; var ipad = ua.match(/(iPad).*OS\s([\d_]+)/), isIphone = ua.match(/(iPhone\sOS)\s([\d_]+)/), isAndroid = ua.match(/(Android)\
js判断是否为移动设备
qianjing0903的博客
06-28 2031
　　下面的代码片段能够检测6种不同的移动设备：　　if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) {            　// 执行相应代码或直接跳转到手机页面　} else {　                // 执行桌面端代码    　}...
js判断pc还是mobile访问
seapeak007的博客
12-05 916
<% /* * *功能：支付宝手机网页支付调试入口页面 *版本：3.3 *日期：2012-08-17 *说明： *以下代码只是为了方便商户测试而提供的样例代码，商户可以根据自己网站的需要，按照技术文档编写,并非一定要使用该代码。 */ %> <% String path = request.getC
基于VUE实现判断设备是PC还是移动端
10-15
在前端开发中，有时我们需要根据用户使用的设备类型来提供不同的界面体验，这通常涉及到判断设备是PC还是移动端。Vue.js，作为一个轻量级且强大的前端框架，提供了多种方式来实现这种设备判断。本文将详细介绍如何在...
js判断PC端与移动端跳转
10-20
本文将详细介绍使用JavaScript（简称js）来判断访问设备类型，并根据设备类型进行PC端与移动端跳转的方法。 一、为什么要判断PC端与移动端 1. 响应式设计：随着移动设备的普及，网页设计需要支持响应式布局，以便在...
js判断移动设备
牧羊人
01-05 671
js判断使用的设备： if((navigator.userAgent.match(/iPhone|iPod/i) != null)||(navigator.userAgent.match(/iPad/i) != null)){//苹果设备 }else if(navigator.userAgent.match(/Android/i) != null){//安卓设备 } js判断在微信
JS判断电脑（pc）还是移动端（mobile）
weixin_46937852的博客
07-21 278
总结，记录： if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { alert("手机"); document.write('手机'); window.location.href = 'https://www.baidu.com' } else { alert("PC"); document.write('PC'); window.location.href = 'https://www.sohu.com'
js判断PC端或是移动端
热门推荐
Rey
09-30 1万+
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) { alert('手机端') }...
JS简单判断PC端还是移动端
K_W_S_S的博客
05-08 385
var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; return {//移动终端浏览器版本信息 trident: u.inde...
js判断是手机还是电脑
yehe_song的博客
06-24 436
<script type="text/javascript"> var system ={}; var p = navigator.platform; system.win = p.indexOf("Win") == 0; system.mac = p.indexOf("Mac") == 0; system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); if(syst
JS判断页面是在手机端还是PC端打开
Ping果狸的博客
01-24 3947
JS判断页面是在手机端还是PC端打开 Navigator 对象包含有关浏览器的信息，它的userAgent 属性是一个只读的字符串，声明了浏览器用于 HTTP 请求的用户代理头的值。所以我们可以通过navigator.useragent里面是否有某些值来判断页面是在手机端还是PC端打开，具体如下： 方法一： function IsPC() { var userAgentInfo =
js 判断pc 还是移动端环境
qq_33240556的博客
05-30 4226
函数，通过检查几个关键的字符串来判断是否为移动设备的浏览器。请注意，这种方法不是100%准确，因为用户代理字符串可以被修改或者模拟，但在大多数情况下足够使用。在JavaScript中，判断当前环境是PC端还是移动端，可以通过检测用户代理字符串（User Agent）来进行简单的区分。更现代和准确的方法可能会考虑使用特性检测（feature detection）或者其他更高级的库来辅助判断，但上述代码对于基本的环境区分已经足够。这段代码首先定义了一个。
js 判断是 pc 还是手机
最新发布
05-16
### 使用 JavaScript 判断设备类型（PC 或 Mobile） 在现代 Web 开发中，检测用户的设备类型是一项常见的需求。以下是几种基于 JavaScript 的方法来实现 PC 和移动端的区分。 #### 方法一：通过 `navigator.userAgent` 进行匹配 可以通过分析 `navigator.userAgent` 字符串中的关键字来识别设备类型。以下是一个简单的例子： ```javascript function isMobileDevice() { const userAgent = navigator.userAgent || navigator.vendor || window.opera; const mobileKeywords = [ 'Android', 'webOS', 'iPhone', 'iPad', 'iPod', 'BlackBerry', 'IEMobile', 'Opera Mini', 'Mobile' ]; return mobileKeywords.some(keyword => userAgent.includes(keyword)); } if (isMobileDevice()) { console.log("This is a mobile device."); } else { console.log("This is a PC."); } ``` 这种方法依赖于用户代理字符串中存在的特定关键词[^2]。然而需要注意的是，某些情况下用户可能修改其 User-Agent 值，这可能导致误判。 #### 方法二：利用屏幕尺寸作为辅助判断依据 除了检查 `User-Agent` 外，还可以结合屏幕宽度进一步确认设备类别： ```javascript function detectDeviceType() { if (/Mobi|Android/i.test(navigator.userAgent)) { return "Mobile"; } // 如果未找到移动设备特征，则继续检查屏幕大小 if (window.screen.width < 768) { return "Small Screen Device"; } return "Desktop"; } console.log(`Detected as: ${detectDeviceType()}`); ``` 此代码片段不仅考虑了典型的移动设备标志词，还加入了对较小分辨率的支持[^3]。不过单独依靠屏幕尺寸可能会错误地标记一些大屏平板电脑为桌面端。 #### 方法三：借助第三方库增强准确性 为了获得更精确的结果并减少维护成本，可以采用成熟的解决方案如 **mobile-detect.js** 库。这是一个轻量级工具包专门用于探测各种手持装置及其操作系统版本号等细节信息。 安装方式： ```bash npm install mobile-detect ``` 实际应用如下所示： ```javascript import MobileDetect from 'mobile-detect'; const md = new MobileDetect(window.navigator.userAgent); if (md.mobile()) { console.log('A mobile phone was detected.'); } if (md.tablet()) { console.log('A tablet was detected.'); } if (!md.mobile() && !md.tablet()) { console.log('Probably running on Desktop'); } ``` 该方案提供了更为丰富的功能集以及更好的兼容性和可靠性[^1]。 --- ### 总结 以上介绍了三种不同的技术路线来进行基本的客户端环境感知操作——从基础的手动解析到高级别的自动化框架集成都有涉及。开发者应根据项目具体场景选取最合适的策略组合起来使用以达到最佳效果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值