45

How can I make a message box appear on page load if the user is using IE 10?

function ieMessage() {
    alert("Hello you are using I.E.10");
}

My webpage is a JSF facelet (XHTML).

Jessica Guerard
  • 356
  • 2
  • 15
user2292674
  • 571
  • 1
  • 5
  • 12
  • 6
    Why do you need to do this? – Ry- Apr 21 '13 at 20:24
  • project for school, got to display messages in different browsers :) – user2292674 Apr 21 '13 at 20:26
  • [Browser detection in javascript?](http://stackoverflow.com/questions/2400935/browser-detection-in-javascript). – Vucko Apr 21 '13 at 20:27
  • 2
    Just a note--I know the world tells me that feature detection and graceful degradation are the way to go, but when it comes to using or avoiding ES6 (and eventually ES7) features, the usual stuff just doesn't work. I can't use 'let' and 'const' and arrow functions on browsers that don't support them, and I want to start using them. That leaves me with little choice other than to detect IEs 10 and 11, and use different scripts with them. – user1329482 Sep 24 '15 at 21:04
  • 1
    @RyanO'Hara I'm having issues with creating a custom scrollbar which you canät do apparantly in IE10 so... – basickarl Jan 27 '16 at 16:13
  • @KarlMorrison: So…? If you can’t do it in IE10, will knowing that the browser is IE10 help you do it? – Ry- Jan 27 '16 at 23:37

3 Answers3

55

The real way to detect this, without conditional comments and without User Agent sniffing is with conditional compilation:

<script type="text/javascript">
    var isIE10 = false;
    /*@cc_on
        if (/^10/.test(@_jscript_version)) {
            isIE10 = true;
        }
    @*/
    console.log(isIE10);
</script>

After running this code, you can use following anytime after:

if (isIE10) {
    // Using Internet Explorer 10
}

Reference: How can I detect IE10 from JS when browser mode is IE9?

UPDATE:

To avoid minification of comments, you can use something like:

var IE = (function () {
    "use strict";

    var ret, isTheBrowser,
        actualVersion,
        jscriptMap, jscriptVersion;

    isTheBrowser = false;
    jscriptMap = {
        "5.5": "5.5",
        "5.6": "6",
        "5.7": "7",
        "5.8": "8",
        "9": "9",
        "10": "10"
    };
    jscriptVersion = new Function("/*@cc_on return @_jscript_version; @*/")();

    if (jscriptVersion !== undefined) {
        isTheBrowser = true;
        actualVersion = jscriptMap[jscriptVersion];
    }

    ret = {
        isTheBrowser: isTheBrowser,
        actualVersion: actualVersion
    };

    return ret;
}());

And access the properties like IE.isTheBrowser and IE.actualVersion (which is translated from internal values of JScript versions).

Community
  • 1
  • 1
Ian
  • 46,701
  • 13
  • 94
  • 107
  • Thanks a lot is working perfectly – user2292674 Apr 21 '13 at 20:35
  • 1
    It would be a lot more annoying to test this in different IE versions, however. – Alex W Apr 21 '13 at 20:35
  • @AlexW Not really. It's fairly easy to modify to get the IE version back (instead of true/false based on a certain version), and is actually reliable. So I'd rather use something that works and can't be spoofed than something that can change and be changed – Ian Apr 21 '13 at 20:37
  • 1
    Great answer, thanks. Could this be updated with IE11? – Zubzob Dec 05 '13 at 16:12
  • @Zubzob Yeah of course, good point! Would you do me a favor, since I don't have IE 11 (and don't want to upgrade to it yet)? Open up the Developer Tools and run `alert(new Function("/*@cc_on return @_jscript_version; @*/")());` - I don't want to assume the number is "11", but I'm guessing it and want to verify that before I add it to the list in my code. – Ian Dec 05 '13 at 16:33
  • 1
    It's undefined apparently – Zubzob Dec 05 '13 at 16:42
  • @Zubzob Interesting...and not good. Hmm – Ian Dec 05 '13 at 16:43
  • Note: I don't personally have IE11 installed either, I asked a friend to run that in the console. – Zubzob Dec 05 '13 at 16:52
  • @Zubzob Hmm okay. I'll see if I can get IE11 somewhere and try it myself (not that it would produce a different result, but I guess I should try) – Ian Dec 05 '13 at 16:56
  • 4
    IE11 does not support conditional compilation. – Aaron Jan 22 '14 at 21:02
  • And what if in the future we reach jscript version 100? – Benjamin Berger Jun 10 '15 at 13:48
  • 3
    @BenjaminBerger This question was for IE 10 specifically, not all versions of IE. It's already been determined that this doesn't work for IE 11 (off topic), as they removed support for conditional compilation. – Ian Jun 10 '15 at 13:50
34

In general, the practice of User Agent sniffing and conditional compilation/comments are best avoided. It is far better to use feature detection, graceful degradation , and progressive enhancement instead. However, for the few edge cases where it is more convenient for the developer to detect the browser version, you can use the following code snippets:

This if statement will only execute on IE 10

// IF THE BROWSER IS INTERNET EXPLORER 10
if (navigator.appVersion.indexOf("MSIE 10") !== -1)
{
    window.alert('This is IE 10');
}

This if statement will only execute on IE 11

// IF THE BROWSER IS INTERNET EXPLORER 11
var UAString = navigator.userAgent;
if (UAString.indexOf("Trident") !== -1 && UAString.indexOf("rv:11") !== -1)
{
    window.alert('This is IE 11');
}

http://jsfiddle.net/Qz97n/

Alex W
  • 33,401
  • 9
  • 92
  • 97
20

Here's a method for getting the current IE or the IE Version:

function IE(v) {
  return RegExp('msie' + (!isNaN(v)?('\\s'+v):''), 'i').test(navigator.userAgent);
}

Here's how you can use it:

if(IE())   alert('Internet Explorer!');
if(IE(10)) alert('Internet Explorer 10!');
Daryl Ginn
  • 1,266
  • 8
  • 14