判断移动端（手机）还是客户端（电脑）打开网页并跳转不同页面（首页）

阅读量：355 次

发布时间：2019-03-04

本文共 479 字，大约阅读时间需要 1 分钟。

移动端与客户端首页布局的解决方案

在移动端和客户端的首页布局中，由于设备的屏幕尺寸和遥感体验存在显著差异，常常需要为不同终端开发专门的HTML页面。以下是实现判断移动端（手机）或客户端（电脑）浏览网页并跳转不同页面的JavaScript代码示例及说明。

代码解释

UA检测：通过navigator.userAgent获取客户端的用户代理字符串，检测是否为常见的移动端设备品牌和类型。

条件判断：使用正则表达式/Android|webOS|iPhone|iPod|BlackBerry/i匹配用户代理字符串，判断是否为移动端设备。

跳转页面：

若为移动端设备，跳转至shouji.html（手机版首页）。

否则，跳转至zaixian.html（电脑版首页）。

注意事项

JS代码应放置在body标签的bottom部分，确保在页面加载完成后立即执行。

shouji.html和zaixian.html分别对应移动端和客户端的首页路径，需根据实际项目路径进行调整。

通过上述方法，可以实现根据终端设备自动跳转不同版本的首页页面，有效解决移动端与客户端布局差异问题。

转载地址：http://bpir.baihongyu.com/

你可能感兴趣的文章

Text-to-Image with Diffusion models的巅峰之作：深入解读 DALL·E 2

TCP基本入门-简单认识一下什么是TCP

tableviewcell 中使用autolayout自适应高度

Symbolic Aggregate approXimation（SAX，符号聚合近似）介绍-ChatGPT4o作答

Orcale表被锁

svn访问报错500

Orderer节点启动报错解决方案：Not bootstrapping because of 3 existing channels

org.apache.ibatis.exceptions.PersistenceException:

org.apache.ibatis.exceptions.TooManyResultsException: Expected one result (or null) to be returned

org.apache.ibatis.type.TypeException: Could not resolve type alias 'xxxx'异常

org.apache.poi.hssf.util.Region

org.apache.xmlbeans.XmlOptions.setEntityExpansionLimit(I)Lorg/apache/xmlbeans/XmlOptions；

org.apache.zookeeper.KeeperException$ConnectionLossException: KeeperErrorCode = ConnectionLoss for /

org.hibernate.HibernateException: Unable to get the default Bean Validation factory

org.hibernate.ObjectNotFoundException: No row with the given identifier exists:

SQL-CLR 类型映射 (LINQ to SQL)

org.springframework.orm.hibernate3.support.OpenSessionInViewFilter

org.springframework.orm.hibernate3.support.OpenSessionInViewFilter

org.springframework.web.multipart.MaxUploadSizeExceededException: Maximum upload size exceeded

org.tinygroup.serviceprocessor-服务处理器