Identify IE9/IE10 using jQuery

Question

I have a jQuery code which is working fine for Chrome/Mozilla but not IE.

if ($("html").hasClass("ie")) {
    $(function(){
        $('.green-column, .red-column, .grey-column').click(function() { 
             alert ($(this).attr("data-type"));           
        });
    });
}
else {
 $(function(){
        $('.green-column, .red-column, .grey-column').click(function() { 
         $("<div title='Selected Task is:'>" + $(this).attr("data-type") + "</div>").dialog({ 
             modal: true,
             resizable: false,
             buttons: [
                {
                   text: "OK", 
                   click: function() { $( this ).dialog( "close" ); }
                }
             ]
         });
    });
});
}
</script> 
<!--[if IE 7]>    <html lang="en-us" class="ie"> <![endif]-->
<!--[if IE 8]>    <html lang="en-us" class="ie"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en-us" class="ie"> <!--<![endif]-->

So I plan to use an alert for IE9/IE10 but I am not able to differentiate between the browsers. Can anyone tell me how to identify IE9/IE10 in jQuery/HTML?

It's not good to differ between browsers nor to deny access for a browser. JQuery should work with IE 9 & 10, so maybe there is a failure in your HTML or CSS code. Try to fix this and don't use browser sniffing. — Eich, Mar 27 '13 at 11:35
If you have a render bug which only occurs in a certain browser and the only way to fix it, is to change a slideUp() to a hide(). Only for certain browsers... — Jaap, Jun 14 '13 at 11:57

score 14 · Accepted Answer · answered Sep 18 '13 at 12:03

14

Can be achieved without using libraries or conditional compilation:

if (document.addEventListener) {
    alert("IE9 or greater");
}

if (window.requestAnimationFrame) {
    alert("IE10 or greater");
}

answered Sep 18 '13 at 12:03

dav

166
1
2

5

Kinda offtopic comment but you can use these 2 conditions to check specifically for `IE9`: `if(document.addEventListener && !window.requestAnimationFrame) { alert("IE9") }` – Adonis K. Kakoulidis Nov 17 '14 at 14:03

score 7 · Answer 2 · edited May 23 '17 at 10:29

7

Just do like this

if ($.browser.msie  && parseInt($.browser.version, 10) > 8) {
  alert('IE9 or IE10'); 
} else {
  alert('Non IE9 or IE10');
}

This should work for jQuery version under 1.9. If you use 1.9+, read this thread or consider using modernizr.

edited May 23 '17 at 10:29

Community

1
1

answered Mar 27 '13 at 11:23

Eli

14,779
5
59
77

4

This only work in versions of jquery prior to 1.9. The $.browser was removed from versions > 1.9. – tbem Mar 27 '13 at 12:12

score 6 · Answer 3 · answered Mar 27 '13 at 11:28

6

The only reliable way to detect the currently active IE version (possibly emulated) is to combine conditional compilation and a document.documentMode check.

Conditional compilation is optional, but it allows you to never run the IE-detection script for non-IE browsers.

For example:

if (/*@cc_on !@*/false && (
       document.documentMode === 9 || document.documentMode === 10)
   ) {
    // IE 9 or 10 (not 8 or 11!)
    document.documentElement.className += ' ie9 ie10';
}

The previous code is not safe against minifiers. If you're going to minify your code, put the conditional compilation stuff in a string, and eval it:

if (eval('/*@cc_on !@*/false') && ( ... )) { ... }

answered Mar 27 '13 at 11:28

Rob W

341,306
83
791
678

I was previously unaware of conditional JS compilation in IE. Entire subject is explained in detail @ http://msdn.microsoft.com/en-us/library/ie/8ka90k2e(v=vs.94).aspx – Elan Hasson Jul 23 '13 at 14:46
@ElanHasson Conditional compilation has been removed from IE11. `document.documentMode` is still there though. – Rob W Jul 23 '13 at 14:49
heh, not that big a deal.. by then we'll have better standards cross-browser and it'll be legacy (Pre-IE10 and Post IE10) :) – Elan Hasson Sep 05 '13 at 02:57

dersvenhesse · Answer 4 · 2013-03-27T11:30:37.680

2

Older jQuery versions before 1.9 offered $.browser to get this. Now jQuery wants you to check for functions instead via $.support.

A pretty good alternative is modernizr (http://modernizr.com/). Modernizr adds classes to your root element like msie or ie9 or webkit or touch and so on.

So you can easily check:

if ($('html').hasClass('ie9')) {
    // do something
}

edited Mar 27 '13 at 11:30

answered Mar 27 '13 at 11:24

dersvenhesse

6,276
2
32
53

What about just doing "if ($('html').is('.ie6, .ie7'))"? Is there any drawbacks or issues with using something as simple as that with jquery? Does that also require Modernizer? – Bryan Jan 16 '15 at 22:06
1

You wouldn't have classes like 'ie7' using only jQuery. – dersvenhesse Jan 17 '15 at 00:10

score 1 · Answer 5 · edited May 23 '17 at 12:26

I know this is an old question. but in case you haven’t found an answer.

Show a message if the browser is not internet explorer 9 or greater

browser={};
if (/(chrome\/[0-9]{2})/i.test(navigator.userAgent)) {
    browser.agent = navigator.userAgent.match(/(chrome\/[0-9]{2})/i)[0].split("/")[0];
    browser.version  = parseInt(navigator.userAgent.match(/(chrome\/[0-9]{2})/i)[0].split("/")[1]);
} else if (/(firefox\/[0-9]{2})/i.test(navigator.userAgent)) {
    browser.agent = navigator.userAgent.match(/(firefox\/[0-9]{2})/i)[0].split("/")[0];
    browser.version  = parseInt(navigator.userAgent.match(/(firefox\/[0-9]{2})/i)[0].split("/")[1]);
} else if (/(MSIE\ [0-9]{1})/i.test(navigator.userAgent)) {
    browser.agent = navigator.userAgent.match(/(MSIE\ [0-9]{1})/i)[0].split(" ")[0];
    browser.version  = parseInt(navigator.userAgent.match(/(MSIE\ [0-9]{1})/i)[0].split(" ")[1]);
} else if (/(Opera\/[0-9]{1})/i.test(navigator.userAgent)) {
    browser.agent = navigator.userAgent.match(/(Opera\/[0-9]{1})/i)[0].split("/")[0];
    browser.version  = parseInt(navigator.userAgent.match(/(Opera\/[0-9]{1})/i)[0].split("/")[1]);
} else if (/(Trident\/[7]{1})/i.test(navigator.userAgent)) {
    browser.agent = "MSIE";
    browser.version  = 11;
} else {
    browser.agent = false;
    browser.version  = false;
}

if (/(Windows\ NT\ [0-9]{1}\.[0-9]{1})/.test(navigator.userAgent)) {
    browser.os = "Windows";
    switch(parseFloat(navigator.userAgent.match(/(Windows\ NT\ [0-9]{1}\.[0-9]{1})/)[0].split(" ")[2])) {
    case 6.0:
        browser.osversion = "Vista";
        break;
    case 6.1:
        browser.osversion = "7";
        break;
    case 6.2:
        browser.osversion = "8";
        break;
    default:
        browser.osversion = false;
    }
} else if (/(OS\ X\ [0-9]{2}\.[0-9]{1})/.test(navigator.userAgent)) {
    browser.os = "OS X";
    browser.osversion = navigator.userAgent.match(/(OS\ X\ [0-9]{2}\.[0-9]{1})/)[0].split(" ")[2];
} else if (/(Linux)/.test(navigator.userAgent)) {
    browser.os = "Linux";
    browser.osversion = false;
}

Identify IE9/IE10 using jQuery

5 Answers5

Linked