设备区分判断IPAD,H5,PC


HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<title>设备区分判断</title>
</head>
<body>
<!--用VUE,否则{{flag}}不好使,这是VUE的写法 -->
<!-- flag=1是ipad,flag = 2 是移动,flag=0是PC -->
<div id="app" v-cloak>
{{flag}}---
<div id="fit">
<!-- 移动端 -->
<div v-if="flag==2">
<span class='font36'>这是移动</span>
</div>
<!-- ipad -->
<div v-else-if="flag==1">
<span class='font36'>ipad</span>
</div>
<!-- pc端 -->
<div v-else>
<span class='font36'>这是pc端</span>
</div>
</div>
<script src="js/vue.js"></script>
<!--当前页面js-->
<script src="js/index.js"></script>
</body>
</html>
index.js
// 区分ipad,H5,PC
var userAgentInfo = navigator.userAgent;
var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");
var flag = 0;
var v=0
for ( v = 0; v < Agents.length; v++)
{
if (userAgentInfo.indexOf(Agents[v]) > 0) {
if(Agents[v]=="iPad"){ //ipad如定义移动端去掉就行了,这里ipad按PC端计算
flag = 1;
}else{
// 移动端
flag = 2;
}
break;
}
} // 区分H5,PC
/*
if (/Android|webOS|iPhone|iPod|iPad|BlackBerry|SymbianOS/i.test(navigator.userAgent)) {
// 移动端
window.flag = 2
} else {
// PC端
window.flag = 1
}
*/
// flag页面中用的VUE写法,需要加VUE声明
var app = new Vue({
el: "#app",
data: { },
methods:{ },
mounted:function(){ }
})
设备区分判断IPAD,H5,PC的更多相关文章
- ios5和ios6横竖屏支持及ipad和iphone设备的判断
ios5和ios6横竖屏支持及ipad和iphone设备的判断 判断是ipad还是iphone设备.此定义在PayViewControllerDemo-Prefix.pch 定义如下: #define ...
- 判断浏览器是pc端还是手机端
1. 判断浏览器是pc端还是手机端 <script type="text/javascript"> var browser = { versions: function ...
- JQuery 判断IPad、IPhone、Android是横屏还是竖屏(Window.Orientation实现)
在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法. 代码如下: function ...
- PHP判断客户端是PC web端还是移动手机端方法
PHP判断客户端是PC web端还是移动手机端方法需要实现:判断手机版的内容加上!c550x260.jpg后缀变成缩略图PHP用正则批量替换Img中src内容,用正则表达式获取图片路径实现缩略图功能 ...
- js判断是否是pc
//判断是否是pc function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = new Array("An ...
- java 判断用户是PC端和还是APP端登陆
java 判断用户是PC端和还是APP端登陆 public void getRequestHeader(HttpServletRequest request){ // 从浏览器获取请求头信息 Stri ...
- 如何判断页面是pc端还是移动端,进入不同的页面
vue判断是pc端还是移动端分别进入不同的页面 判断移动端代码如下: function IsPC(){ var userAgentInfo = navigator.userAgent; var Age ...
- 区分移动端和pc端
区分移动端和pc端: window.navigator.userAgent.toLowerCase().indexOf('mobile')== -1 判断 等于-1就是pc,false就是移动端 ...
- 判断移动还是PC 以及微信环境
//判断pc还是移动端 function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Andro ...
- 媒体查询判断ipad和iPhone各版本
/* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ /* s ...
随机推荐
- 大前端html基础学习03-定位锚点透明
一.position 定位属性和属性值position 定位属性,检索对象的定位方式:语法:position:static /absolute/relative/fixed/sticky/unset/ ...
- Linux 系统环境监测
Linux系统环境监测 Linux系统环境主要监测CPU.内存.磁盘I/O和网络流量. 1. CPU (1) 查看CPU的负载情况:uptime 可以通过uptime查看系统整体的负载情况. 如果服务 ...
- MassTransit 知多少 | 基于MassTransit Courier实现Saga 编排式分布式事务
Saga 模式 Saga 最初出现在1987年Hector Garcaa-Molrna & Kenneth Salem发表的一篇名为<Sagas>的论文里.其核心思想是将长事务拆分 ...
- Netty-BIO、NIO、AIO、零拷贝-2
Java BIO 编程 一.I/O 模型 1.I/O 模型简单的理解:就是用什么样的通道进行数据的发送和接收,很大程度上决定了程序通信的性能 2.Java 共支持 3 种网络编程模型/IO 模式:BI ...
- 使用jquery—Canvas实现html5小游戏——《坦克大战》
目录 1.项目背景 2.项目展示 3.设计思路 3.1.坦克移动 3.2.坦克开火 3.3.击中坦克 4.实现代码 5.总结 1.项目背景 2021年春节期间在家无聊,正好又学过一些前端的知识,因此就 ...
- Ventoy制作启动盘和使用VMware测试启动盘(论文版)
- 1 Ventoy 1.1 Ventoy是什么 Ventoy是可用于制作启动U盘的开源工具,在占用少量引导分区容量后,其他空间依旧可以正常当一般的U盘读写文件.它的最大特点是只要将iso.win. ...
- NetCore模型绑定之FromBodyFromUriFromQueryFromRoute
title: .Net Core模型绑定之FromBody.FromUri.FromQuery.FromRoute categories: 后端 date: 2022-10-29 17:21:11 t ...
- 蓝桥真题——最短路 & 门牌制作
题目1 最短路 标签:填空题 2019 省赛 如下图所示,G 是一个无向图,其中蓝色边的长度是 1.橘色边的长度是 2.绿色边的长度是 3. 则从 A 到 S 的最短距离是多少? 答案 由图可得,最短 ...
- string 类的用法
访问字符串中的元素 string 字符串也可以像C风格的字符串一样按照下标来访问其中的每一个字符.string 字符串的起始下标仍是从 0 开始.请看下面的代码: int main(){ string ...
- 案例:用ajax 方法 解析xml
xml文件 <?xml version="1.0" encoding="utf-8"?> <studentlist> <stude ...