需求:

由于公司项目对于ie浏览器只支持ie10及以上版本,为了更好的用户体验及人性化提示,想在代码里判断下ie浏览器低版本加个提示。

解决方案:

先贴代码:

<!--[if lte IE 9]><script>alert("您正在使用的浏览器版本过低,为了您的最佳体验,请先升级浏览器。");window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);</script>
<![endif]-->

将这段代码放在html文件的head标签内即可。

我公司这个项目是vue-cli构建的单页面应用,所以就贴在了项目工程根目录的index.html里,非单页面应用可以贴在登录页里。

例如我的index.html是这样滴:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="renderer" content="webkit"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"><meta name="format-detection" content="telephone=no"><title></title><!--[if lte IE 9]><script>alert("您正在使用的浏览器版本过低,为了您的最佳体验,请先升级浏览器。");window.location.href="http://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href);</script><![endif]--></head><body><div id="app"></div></body>
</html>

拓展

以上是针对ie9及以下版本,

针对ie8及以下版本只需把9换成8即可,

针对ie10及以下版本使用:

  <script>/*@cc_on alert("您正在使用的浏览器版本过低,为了您的最佳体验,请先升级浏览器。");window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); @*/</script>

参考:https://support.dmeng.net/upgrade-your-browser.html

h5前端IE浏览器低版本判断及升级提示相关推荐

  1. IE浏览器低版本判断及升级提示

    需求: 由于公司项目对于ie浏览器只支持ie10及以上版本,为了更好的用户体验及人性化提示,想在代码里判断下ie浏览器低版本加个提示. 解决方案: 先贴代码: <!--[if lte IE 9] ...

  2. position:fixed 兼容浏览器低版本

    项目中遇到的坑,写篇博客做个笔记纪念下,position: fixed一般来说都兼容各个浏览器,但是要兼容浏览低版本问题,就得用-webkit-transform: translateZ(0);这段代 ...

  3. 解决IE浏览器低版本兼容性问题的最快方法

    解决IE8以下浏览器低版本的兼容性问题,最快的方法就是将以下代码放在网页的head标签内: <!--[if lte IE 8]> <script async>location. ...

  4. Safari浏览器低版本时候,只发option-CorsFilter配置

    跨域拦截配置,是个坑,使用 * ,对于低版本的safri浏览器是不行的. 当初配置CorsFilter,是为了解决跨域的问题,但是今天发现低版本的safri浏览器发不了请求.最后通过抓包工具,查看发送 ...

  5. 解决html5语意标签在IE低版本浏览器下的兼容问题:

    方法一:手动改写. 1.在body中写入h5语意标签,这里用nav标签举例子:<nav></nav> 2.在js中手动创建h5的语意标签:document.createElem ...

  6. 【面试】兼任IE低版本思路方案

    [主要是针对ie6 7 8对支持和让老浏览器支持html5+css3的一些js脚本] html5shiv.js             // 让IE8及耕地版本的IE识别section,article ...

  7. [c#]使用Fleck实现简单的WebSocket含兼容低版本IE

    WebSocket是html5的一种协议,那么就表示要使用websocket客户端的浏览器就要支持html5. 对于不支持的使用flash去解决. Fleck源码地址 服务端采用的是Fleck,Fle ...

  8. 解决vue低版本ios,安卓手机浏览器打开H5页面空白的问题

    低版ios手机ios8,ios9,安卓6以后的自带浏览器打开VUE开发的H5页面有时候会出现白屏的问题,这是因为vue 项目中es6的方法和语法在这些低版本的手机上不支持,解决办法 es6转es5 一 ...

  9. 低版本IE浏览器不支持前端代码修改属性remove()的解决办法

    今天在工作中碰到了低版本IE浏览器不支持对象属性移除(remove)和添加(add)的方法,请教了同事结合在网上找到的资源最后写了这一段代码,完美的解决了一个前端基础问题,在此记录一下,希望可以帮助到 ...

最新文章

  1. 戴尔PowerEdge-C服务器新成员
  2. 语音合成技术与资源 - 资源篇
  3. .NET库和向后兼容的技巧——第2部分
  4. CSS尺寸与文本讲解。HTML、CSS笔记(四)。
  5. Redis大批量插入数据
  6. 《痞子衡嵌入式半月刊》 第 48 期
  7. 用卡尔曼滤波器跟踪导弹
  8. Model 3 FBCM
  9. Exchange Server 2007+0ffice Communication Server 2007构建统一消息平台
  10. PADS VX2.7学习记录04-PADS Layout软件操作
  11. 【滴滴出行】真题-地下迷宫
  12. Python详细了解强化学习算法并基于强化学习Q_learning让电脑玩flappy bird游戏
  13. 【uniapp引入阿里字体图标】
  14. it技术 学习资料库 红黑联盟:
  15. 大咖专访:同Bigbang公链创始人“一休”一起见证区块链技术的缘起时刻!
  16. yy里怎么复制别人的话_怎么把复制的yy频道弄上去
  17. 亚马逊:长尾商品解锁的新价值曲线【姜太公公】
  18. 中国民营医疗行业运行效益分析及未来发展形势规划建议报告2022年版
  19. Simpler is Better
  20. 一文总结那些年我们追过的计算机发展史

热门文章

  1. 有5个人坐在一起,问第五个人多少岁?他说比第4个人大2岁。问第4个人岁数,他说比第 3个人大2岁。问第三个人,又说比第2人大两岁。问第2个人,说比第一个人大两岁。最后 问第一个人,他说是10岁。请问第
  2. sublime 自定义快捷键、宏录制
  3. 【数据结构机试复习2】 赛马 猴子选大王
  4. Android 个人中心页面前端代码
  5. 论文阅读笔记《Meta-Transfer Learning for Few-Shot Learning》
  6. 深入探析CAN收发器各项参数
  7. 2020-12-26 工作常用 Linux 操作:磁盘卸载、 自动化挂盘脚本 、磁盘分区合并、ansible、git 设置相关
  8. [Ubuntu] Ubuntu16.04+win10+联想Y7000+显卡+WIFI 装机成功
  9. linux 禁用cpu的acpi,Linux中的ACPI和APIC
  10. Centos配置NFS