IE11 detect whether compatibility view is ON via javascript

does anyone know how to check if IE 11 compatibility mode is ON when I'm on a website through javascript?

I added the url to the list compatibility view settings. But when I do

navigator.userAgent

in developer tools, it returns

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

Looking at the microsoft website (http://msdn.microsoft.com/en-us/library/ie/hh869301(v=vs.85).aspx), it says

The compatible ("compatible") and browser ("MSIE") tokens have been removed.

Any help on detecting whether a page is using compatibility view via javascript would be really helpful. Thanks in advance.

jaegs

SOLVED

While searching for an answer to this question myself, I found this solution from Nenad Bulatovic in another thread but his response wasn't marked as the correct answer. I tested this out in IE11 and downgrading to IE5 and found that it works for IE7-IE11, which is great. I wanted to share it here in case anyone else finds it useful.

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>

source: Detect IE10 compatibility mode

I wrote a JavaScript function, ie-truth, to do just this. How it works is that in IE 11 if compatibility mode is turned on, the User Agent string will contain the Trident version number for IE 11 (7.0) as well as the MSIE version number for an older version of IE (such as 7.0 for IE 7). This also applies to compatibility mode in older versions of IE.

Kris Truyens

Add this to web.config file and application will overwrite user's setting.

<configuration>
  ...
  <system.webServer>
    ...
    <httpProtocol>
        <customHeaders>
          <clear/>
          <add name="X-UA-Compatible" value="IE=8; IE=9; IE=EDGE" />
        </customHeaders>
    </httpProtocol>
    ...
  </system.webServer>
  ...
</configuration>

Place the "system.webServer" tag at the end of your web.config file just before the closing "configuration" tag. Additionally, you can add the X-UA-Compatible tag in IIS on your webserver by selecting your website and clicking on the HTTP Response Headers icon.

I would recommend that one uses feature detection rather than indirectly querying the browser version. So, for example, if you require the HTML 5 history API feature, do something like:

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 ...');
}

Per the user agent article of the IE Compatibility Cookbook, there is a way you can tell that compat mode is enabled, but only when the user-agent string cooperates.

Specifically, if the browser token says MSIE 7.0 and the Trident token says Trident/7.0, that's a pretty clear indication. Still, the changes to the UA string since IE11 RTM show that you cannot--and should not--rely on it as a predicable resource in future versions.

To learn more about the individual tokens, see the Understanding user-agent strings topic. (It's not entirely current, but what is there seems relevant to your interests.)

Hope this helps...

-- Lance

A reliable solution you can edit that works for Internet Explorer 8 to 11 (needs extra code to support < IE8).

Nasty side-effects (only if IE < 11 or documentMode < 11 -- ouch):

This will cause problems with //@ sourceMappingURL=xx.js (e.g. in jQuery < 1.11, or other libraries that haven't updated to the newer //# format).
Apparently @cc_on dramatically slows down js evaluation (re Paul Irish who knows his stuff).

The basic reason it works is that:

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

returns the real version of IE regardless of compatibility mode. Notes:

ieRealVersion is undefined for IE11 in IE11 mode, but document.documentMode == 11 in that case.
ieRealVersion is 5.8 for IE8.
ieRealVersion is 5.7 for IE7, and also 5.7 for IE6 SP3. However documentMode is undefined so you need extra code to detect actual browser (fairly trivial, but I don't support IE6/7 any more, so I haven't bothered to code that).
This is a reliable way to sniff for Internet Explorer 6-10 that I have used for many years with no problems (but which has caused problems for others due to @cc_on).

A simple solution, try it in the console:

if (typeof(window.getSelection) == "undefined") {
   alert("Unsupported browser!");
} else {
   alert("Supported browser");
}

Will detect any IE less than IE9 (including compatibility view). Would also detect Chrome 4-14 according to caniuse.

IE 6-8: Supports selection events, but not window.getSelection() Ref: https://caniuse.com/#feat=selection-api

来源：https://stackoverflow.com/questions/27912296/ie11-detect-whether-compatibility-view-is-on-via-javascript

标签

javascript

internet-explorer-11

ie-compatibility-mode