旧版 IE 升级提示弹窗代码

此代码是旧版 Internet Explorer 淘汰行动一部分，如需查看项目介绍请点击链接查看，本页只介绍弹窗代码。

弹窗代码的由来

2014年8月，旧版IE淘汰行动初上线时，仅提供升级提示页跳转代码，设计思路来自微软官网。采用页面跳转方式本意是，网站在不支持的旧版IE中往往是错版，因此可以直接跳转至升级提示页，避免加载无用的资源的同时在第一时间告诉用户该升级浏览器了。

但升级提示页并未能满足所有实际场景。例如，有的网站以文字内容为主，尽管在旧版IE中网站排版出现错位，却不影响文字内容的展现。因此有的网站主希望只提示用户进行浏览器升级，是否升级由用户决定，用户选择忽略升级提示也能继续访问错版的网页。

于是，旧版IE淘汰行动新增旧版IE升级提示弹窗代码，以适应更多场景。

弹窗代码的特性

弹窗代码最大的特性莫过于不跳出原有网页，直接在当前网页展示，用户可以选择关闭弹窗继续浏览网页内容。在代码配置方面，可以决定用户关闭弹窗后多少分钟内不再出现。此外，通过 if IE 以及 @cc_on 语句的配合，弹窗代码将只再需要进行升级提示的IE版本中加载，其他浏览器不加载。

关于弹窗的设计

实际上，旧版IE升级提示弹窗的代码在网上并不少见，大部分是采用头部横幅一句话提示，小部分一张大图加一段简要文字提示，对小白用户并不友好。至今仍使用旧版IE浏览器的用户，除了极少数专业人士，剩下的都是小白。专业人士使用旧版IE往往是出于实际需要（例如测试），无论你如何提示他们都不会升级；而小白用户则往往是因为不懂电脑，因此提示语不能无足轻重，否则无法说服他们升级，也不能只使用术语，否则小白看不懂。

因此，本弹窗的设计定位针对小白用户，主配色采用黄、白，整体偏暖，大标题采用深红色并配以加粗的“危险！”、“请立即升级！”等警示字样，营造一种需要立即升级的迫切感，引导用户尽快完成升级到新版浏览器。另，特别为使用国产双核浏览器IE兼容模式的用户提供切换至极速内核的示意图，引导用户通过切换内核来正常访问网页，在避免流量流失的同时为用户提供最好的访问体验。查看弹窗截图

弹窗代码

了解 if IE 和 @cc_on 语句

if IE 是IE浏览器特有的条件注释语句，语法如 ，用于判断IE版本，只在IE9及更旧版IE有效，在IE10、IE11或其他浏览器会被当作普通注释忽略；@cc_on 是IE浏览器特有的条件编译语句，语法如 /*@cc_on @*/，只在IE10及更旧版本IE有效，在IE11或其他浏览器会被当作普通注释忽略。弹窗代码将根据不同情况使用这两种特性，以实现代码只在需要进行升级提示的IE版本中加载，其他浏览器不加载。

关于双核浏览器的兼容问题

请在 <head> 后弹窗代码前添加如下代码，有了如下代码，内置 Chromium 和 IE 双核的浏览器会优先使用 Chromium 内核，IE也会优先使用最高内核，而非兼容模式。详细解释请参阅旧版 Internet Explorer 淘汰行动的代码解释。

需要注意的是，以下规定内核的代码并非总是有效，当你的域名是 gov.cn 或 edu.cn 结尾时，或当你的网页内容存在类似“IE9.0或以上浏览器访问达到最佳效果”的提示时，此代码将失效。

不过，正如前文所述，弹窗代码为双核浏览器用户提供了切换内核示意图，引导用户通过切换内核正常访问。查看效果截图

<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

可选配置

弹窗代码提供两个参数可供配置。一是决定用户关闭弹窗后多少分钟不再展示弹窗的 once 参数，不配置将不限制，用户每次打开或刷新页面都展示一次；二是决定从哪个IE版本开始提示升级的 outver 参数，最高是11（即所有IE都提示升级），最低是6，默认是10（即IE10及以下都提示升级）。

示例〇。所有IE访问都提示升级（包括IE11、IE10、IE9、IE8、IE7、IE6），每次打开都提示升级：

<script>if (/*@cc_on!@*/false || (!!window.MSInputMethodContext && !!document.documentMode)) document.write('\x3Cscript id="_iealwn_js" data-outver="11" src="https://support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); </script>

示例一。在IE10、IE9、IE8、IE7、IE6及以下版本提示升级，每次打开都提示升级：

<script>/*@cc_on 
var _iealwn = {once: 0, outver: 10};
document.write('\x3Cscript id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); 
@*/</script>

默认配置就是 {once: 0, outver: 10}，因此这个例子可以简写为：

<script>/*@cc_on document.write('\x3Cscript id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); @*/</script>

示例二。在IE9、IE8、IE7、IE6及以下版本提示升级，每次打开都提示升级：

<!--[if lte IE 9]>
<script>var _iealwn = {once: 0, outver: 9};</script>
<script id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js"></script>
<![endif]-->

示例三。在IE8、IE7、IE6及以下版本提示升级，每次打开都提示升级：

<!--[if lte IE 8]>
<script>var _iealwn = {once: 0, outver: 8};</script>
<script id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js"></script>
<![endif]-->

示例四。在IE7、IE6及以下版本提示升级，每次打开都提示升级：

<!--[if lte IE 7]>
<script>var _iealwn = {once: 0, outver: 7};</script>
<script id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js"></script>
<![endif]-->

重复弹窗配置

如配置解说所言，使用以上例子代码，用户点击关闭弹窗后，只要打开或刷新页面都会再次弹窗提示，因为 once 参数没有配置有效数值。如果不想弹窗太频繁，可以设置一个数值，例如3，那么，用户点击关闭弹窗后3分钟内无论是打开新页面还是刷新页面都不会再弹窗提示。

以下是一个例子：

<script>/*@cc_on 
var _iealwn = {once: 3, outver: 10};
document.write('\x3Cscript id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); 
@*/</script>

这个功能的实现依赖 Cookie ，字段名为 _iealwn 。如用户浏览器禁止了 Cookie 功能则配置失效。

一个完整的HTML示例

以下例子使用默认配置，微软已经停止支持的IE10及更旧版IE都提示升级。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8"/>
    <meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>
    <script>/*@cc_on 
    document.write('\x3Cscript id="_iealwn_js" src="https://support.dmeng.net/ie-alert-warning/latest.js">\x3C/script>'); 
     @*/</script>
    <title>网页标题</title>
    <!-- 其他meta标签 -->
</head>
<body>
    <h1>网页内容</h1>
</body>
</html>

代码维护

当前弹窗代码已在 Windows XP IE6/IE7/IE8 和 Windows 7 IE8/IE9/IE10 环境下通过测试，均正常展示。但，由于多数双核浏览器在IE兼容模式时都不向 userAgent 添加标识，难以识别，双核浏览器切换内核示意图仅在 Windows 7 IE9/IE10 内核可全部通过测试，在 IE6/IE7/IE8 内核仅部分通过测试，更多检测方法仍在研究中，弹窗代码仍在持续完善中。代码及静态资源由腾讯云及阿里云提供极速访问。