如何通过 JavaScript 检测 IE11 是否启用了兼容性视图?

20

有人知道如何通过JavaScript检查我在网站上是否开启IE 11兼容模式吗?

我已将该网站的URL添加到兼容性视图设置列表中。但是当我这样做时:

navigator.userAgent

在开发者工具中,它返回:

Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; .NET4.0E; .NET4.0C; .NET CLR 3.5.30729; .NET CLR 2.0.50727; .NET CLR 3.0.30729; InfoPath.3; rv:11.0) like Gecko

查看微软网站 (http://msdn.microsoft.com/en-us/library/ie/hh869301(v=vs.85).aspx),指出:

"兼容"("compatible")和 "MSIE" 浏览器标记已被删除。

希望能够通过JavaScript检测页面是否使用兼容性视图。先行致谢。


1
你查看过 document.compatModedocumentMode 吗?(我不确定这些在 IE 11 中是否相关/可用。) - CBroe
https://dev59.com/GmUq5IYBdhLWcg3wF8rw - Ron Gilchrist
可以问一下您为什么要知道用户是否处于兼容模式吗? - Sampson
我只是在做一些测试。在之前的IE版本中,URL栏中会有一个“损坏的页面”图标。但在IE 11中,无法确定页面是否正在使用兼容视图。 - slee
@slee 你有检查过 document.documentMode 吗? - Sampson
7个回答

26

已解决

在寻找答案时,我在另一篇帖子中发现了Nenad Bulatovic的解决方案,但他的回复未被标记为正确答案。我在IE11和降级到IE5中测试了这个方案,并发现它适用于IE7-IE11,这非常好。我想在这里分享它,以防其他人也会发现它有用。

iecheck.js

function trueOrFalse() {
    return true;
}

function IeVersion() {
    //Set defaults
    var value = {
        IsIE: false,
        TrueVersion: 0,
        ActingVersion: 0,
        CompatibilityMode: false
    };

    //Try to find the Trident version number
    var trident = navigator.userAgent.match(/Trident\/(\d+)/);
    if (trident) {
        value.IsIE = true;
        //Convert from the Trident version number to the IE version number
        value.TrueVersion = parseInt(trident[1], 10) + 4;
    }

    //Try to find the MSIE number
    var msie = navigator.userAgent.match(/MSIE (\d+)/);
    if (msie) {
        value.IsIE = true;
        //Find the IE version number from the user agent string
        value.ActingVersion = parseInt(msie[1]);
    } else {
        //Must be IE 11 in "edge" mode
        value.ActingVersion = value.TrueVersion;
    }

    //If we have both a Trident and MSIE version number, see if they're different
    if (value.IsIE && value.TrueVersion > 0 && value.ActingVersion > 0) {
        //In compatibility mode if the trident number doesn't match up with the MSIE number
        value.CompatibilityMode = value.TrueVersion != value.ActingVersion;
    }
    return value;
}

iecheck.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Testing IE Compatibility Mode</title>
    <script src="iecheck.js" type="text/javascript"></script>
</head>
<body>
<div id="results">Results: </div>
</br>
<script type="text/javascript">

var ie = IeVersion();

document.write("IsIE: " + ie.IsIE + "</br>");
document.write("TrueVersion: " + ie.TrueVersion + "</br>");
document.write("ActingVersion: " + ie.ActingVersion + "</br>");
document.write("CompatibilityMode: " + ie.CompatibilityMode + "</br>");

</script>
</body>
</html>

来源:检测IE10兼容性模式


1
value.CompatibilityMode = value.TrueVersion != value.ActingVersion; 兼容模式=怪癖。这不会检测怪癖。它只告诉我们IE正在运行较低版本的仿真,这本身可能是怪癖或标准模式。 - Victor Zakharov
为什么这里的JavaScript代码内容和一年前发布的答案中的相同?虽然我承认将代码发布在此处而不是链接到git存储库更好,但它会导致混淆,因为似乎有两种可能的解决方案。 - JRSofty

8
我写了一个JavaScript函数,ie-truth,它可以实现这个功能。它的工作原理是,在IE 11中如果打开了兼容模式,用户代理字符串将包含Trident版本号(7.0)和旧版IE的MSIE版本号(例如IE 7的7.0)。这也适用于旧版IE中的兼容模式。

3
是的,这部分是正确的,但是我发现可以通过IE 11的设置强制对一个域使用“兼容模式”,然后让Web服务器声明“X-UA-Compatible: IE=edge”。这将使其处于一种奇怪的半兼容模式下,可能会导致某些问题(例如Google的Recaptcha)。用户代理字符串似乎无法检测到这种特殊情况。 - Simon East
@SimonEast,我在努力寻找一种方法,以确保Google验证码在IE用户上不会出现问题,同时又不强制用户处理他们的浏览器设置。这里有一个开放性问题,如果您有任何解决方案,我会非常感兴趣。(http://stackoverflow.com/questions/42768017/unable-to-reliably-use-google-recaptcha-2-0-and-jquery-2-1-4-because-of-ie-compa) - Drew

7
将下列代码添加到web.config文件中,应用程序将会覆盖用户的设置。
<configuration>
  ...
  <system.webServer>
    ...
    <httpProtocol>
        <customHeaders>
          <clear/>
          <add name="X-UA-Compatible" value="IE=8; IE=9; IE=EDGE" />
        </customHeaders>
    </httpProtocol>
    ...
  </system.webServer>
  ...
</configuration>

在web.config文件的结束标签"configuration"之前放置 "system.webServer" 标记。此外,您可以通过选择网站并单击HTTP响应标头图标,在Web服务器上添加X-UA-Compatible标记。

这段代码应该放在 web.config 的哪个部分?它是否强制开启或关闭兼容模式? - BoltBait
它强制关闭兼容模式。它所在的层次结构现在在答案中。 - Jason Dimmick

1

一个可靠的解决方案,您可以{{link2:编辑},适用于Internet Explorer 8到11(需要额外的代码支持< IE8)。

令人讨厌的副作用(仅当IE <11或documentMode <11才有 -- 糟糕):

  • 这将导致问题//@ sourceMappingURL=xx.js(例如在jQuery <1.11中,或其他尚未更新为较新//#格式的库中)。
  • 显然@cc_on会大大减慢js评估(来自知道他东西的Paul Irish)。

它能够工作的基本原因是:

var ieRealVersion = Function('return /*@cc_on @_jscript_version@*/;')();

无论兼容模式如何,返回IE的真实版本。注意:

  • 在IE11模式下,IE11的ieRealVersion未定义,但在这种情况下document.documentMode == 11。
  • 对于IE8,ieRealVersion为5.8。
  • 对于IE7,ieRealVersion为5.7,对于IE6 SP3也是5.7。但是,documentMode未定义,因此您需要额外的代码来检测实际浏览器(相当简单,但我不再支持IE6 / 7,因此我没有费心编写)。
  • 这是一种可靠的方法,可以用于嗅探Internet Explorer 6-10,我已经使用了很多年,没有任何问题(但由于@cc_on而给其他人带来了问题)。

1
我建议使用特性检测来代替间接查询浏览器版本。例如,如果您需要HTML 5历史记录API功能,请执行以下操作:
if (window.history && window.history.pushState) {
    console.log('This is a SUPPORTED browser');
} else {
    console.log('NO! You require a browser that does X, please try installing ...');
}

0
根据用户代理文章和IE兼容性手册,有一种方法可以告诉您兼容模式是否已启用,但仅当用户代理字符串配合使用时才能实现。
具体来说,如果浏览器标记为MSIE 7.0,并且Trident标记为Trident/7.0,那么这是一个非常明显的指示。然而,自IE11 RTM以来UA字符串的更改表明,您不能 - 也不应该 - 在将来的版本中依赖它作为可预测的资源。
要了解有关各个标记的更多信息,请参阅了解用户代理字符串主题。(它并不完全最新,但其中的内容似乎与您的兴趣相关。)
希望这可以帮助到您...
-- Lance

0
一个简单的解决方案,可以在控制台中尝试:
if (typeof(window.getSelection) == "undefined") {
   alert("Unsupported browser!");
} else {
   alert("Supported browser");
}

将检测任何低于IE9(包括兼容性视图)的IE。 根据caniuse,还将检测Chrome 4-14。

IE 6-8:支持选择事件,但不支持window.getSelection() 参考:https://caniuse.com/#feat=selection-api


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接