使用 jQuery 识别 IE9/IE10答案

【问题标题】：Identify IE9/IE10 using jQuery使用 jQuery 识别 IE9/IE10
【发布时间】：2013-03-17 11:03:59
【问题描述】：

我有一个适用于 Chrome/Mozilla 但不适用于 IE 的 jQuery 代码。

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]-->

所以我计划对 IE9/IE10 使用警报，但我无法区分浏览器。谁能告诉我如何在 jQuery/HTML 中识别 IE9/IE10？

【问题讨论】：

在浏览器之间进行区分或拒绝浏览器的访问都不好。 JQuery 应该适用于 IE 9 和 10，因此您的 HTML 或 CSS 代码可能存在故障。尝试解决这个问题，不要使用浏览器嗅探。
如果你有一个只出现在特定浏览器中的渲染错误，并且修复它的唯一方法是将slideUp() 更改为hide()。仅适用于某些浏览器...

标签： jquery html internet-explorer browser-detection

【解决方案1】：

无需使用库或条件编译即可实现：

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

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

【讨论】：

有点离题的评论，但您可以使用这两个条件来专门检查IE9：if(document.addEventListener && !window.requestAnimationFrame) { alert("IE9") }

【解决方案2】：

就这样吧

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

这应该适用于 1.9 以下的 jQuery 版本。如果您使用 1.9+，请阅读此 thread 或考虑使用 modernizr。

【讨论】：

这仅适用于 1.9 之前的 jquery 版本。 $.browser 已从 > 1.9 版本中删除。

【解决方案3】：

检测当前活动的 IE 版本（可能是模拟的）的唯一可靠方法是结合 conditional compilation 和 document.documentMode 检查。

条件编译是可选的，但它允许您从不为非 IE 浏览器运行 IE 检测脚本。

例如：

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

前面的代码对缩小器是不安全的。如果你要缩小你的代码，把条件编译的东西放在一个字符串中，然后eval它：

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

【讨论】：

我以前不知道 IE 中的条件 JS 编译。整个主题详细讲解@msdn.microsoft.com/en-us/library/ie/8ka90k2e(v=vs.94).aspx
@ElanHasson 已从 IE11 中删除条件编译。 document.documentMode 仍然存在。
呵呵，没什么大不了的.. 到那时我们将拥有更好的跨浏览器标准，它将成为传统（IE10 之前和 IE10 之后）:)

【解决方案4】：

1.9 之前的旧 jQuery 版本提供 $.browser 来获得这个。现在 jQuery 希望你通过 $.support 检查函数。

modernizr (http://modernizr.com/) 是一个不错的选择。 Modernizr 将类添加到您的根元素中，例如 msie 或 ie9 或 webkit 或 touch 等等。

所以你可以很容易地检查：

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

【讨论】：

只做“if ($('html').is('.ie6, .ie7'))”怎么样？使用像 jquery 这样简单的东西有什么缺点或问题吗？这是否也需要 Modernizer？
你不会有像 'ie7' 这样只使用 jQuery 的类。

【解决方案5】：

我知道这是一个老问题。但万一你还没有找到答案。

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;
}

【讨论】：