使用jQuery识别IE9/IE10

Question

使用jQuery识别IE9/IE10

jqueryhtmlinternet-explorerbrowser-detection

4

我有一段jQuery代码，在Chrome/Mozilla中可以正常工作，但在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]-->

我计划在IE9/IE10中使用警报，但我无法区分这两个浏览器。有人能告诉我如何在jQuery/HTML中识别IE9/IE10吗？

- Nitish T

区分浏览器或拒绝某个浏览器的访问都不是好的做法。JQuery 应该可以在 IE 9 和 10 中使用，因此可能是您的 HTML 或 CSS 代码出了问题。尝试修复这个问题，不要使用浏览器嗅探。 - Eich

1

如果你遇到一个只在特定浏览器中出现的渲染错误，并且唯一修复方法是将slideUp()更改为hide()，仅适用于特定浏览器... - Jaap

5个回答

7

只需像这样操作即可

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

这个方法适用于 jQuery 版本 1.9 及以下。如果您使用的是 1.9+，请阅读此帖子或考虑使用 modernizr。

- Eli

4

这仅适用于 jQuery 1.9 之前的版本。在版本大于 1.9 的 jQuery 中，$.browser 已被删除。 - tbem

6

检测当前IE版本（可能是模拟的）的唯一可靠方法是结合条件编译和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') && ( ... )) { ... }

- Rob W

我之前不知道IE中的JS条件编译。整个主题在http://msdn.microsoft.com/en-us/library/ie/8ka90k2e(v=vs.94).aspx中详细解释。 - Elan Hasson

@ElanHasson 条件编译已从IE11中删除。不过，document.documentMode仍然存在。 - Rob W

呵呵，没那么大的问题...到那时我们会有更好的跨浏览器标准，它将成为遗留（IE10之前和IE10之后）:) - Elan Hasson

2

较旧版本的jQuery（1.9之前）提供了$.browser来获取此信息。现在，jQuery希望您通过$.support检查函数来获取此信息。一个非常好的替代品是modernizr（http://modernizr.com/）。Modernizr会向根元素添加类，例如msie、ie9、webkit、touch等等。因此，您可以轻松地进行检查：

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

- dersvenhesse

只使用 "if ($('html').is('.ie6, .ie7'))" 有什么问题或缺点吗？在jquery中使用这么简单的东西是否会有任何问题？这是否也需要Modernizer？ - Bryan

1

你不应该只使用jQuery来创建类似于“ie7”的类。 - dersvenhesse

1

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

如果浏览器不是Internet Explorer 9或更高版本，则显示一条消息

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

- Dany

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- dav · Accepted Answer

可以在不使用任何库或条件编译的情况下实现：

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

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