0

我在网站上实现的 Extjs 元素存在一些问题,需要执行一些 IE10 特定样式来解决这些问题。我知道 IE10 不再支持旧的 IE 样式注释,您可以根据 IE 的版本有条件地指定一个不同的 html 标记并附加不同的类。因此,在这种情况下,我将不得不使用 jQuery 将 IE10 类附加到 HTML 标记中,这不是最佳解决方案,但由于我们的用户无论如何都需要启用 Javascript,因此这是我们目前的最佳选择。

我目前正在使用以下代码段来尝试实现这一目标:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
    <script type="text/javascript">
      if ($.browser.msie && $.browser.version == 10) {
         $("html").addClass("ie10");
    }
    </script>

但是,如果我在开发人员模式下查看/在 IE10 中查看页面的源代码,则不会将任何内容附加到 HTML 标记中。然后,我使用 Firebug(因为 IE 开发人员工具很糟糕)检查我使用的脚本是否有任何问题,并且我的控制台中有以下消息:

  TypeError: $.browser is undefined
     [Break On This Error]  

      if ($.browser.msie && $.browser.version == 10) {

由于我很少使用 Javascript 进行浏览器检测,我承认我从网络上借用了这个脚本,并且评论都表明它可以工作,但你可以清楚地看到它没有。

有没有人知道如何调整它以使其正常工作,或者我可以用来专门针对 IE10 使用我的 CSS 的任何替代方案?

4

5 回答 5

3

您可以使用条件编译来仅获取 IE10,这是一个好方法,因为它不依赖 jQuery 或任何可能被欺骗的东西(afaik)。

在 IE8、IE9、IE10、Chrome 上对其进行了测试,并按预期工作。

用法:

if(Function('/*@cc_on return document.documentMode===10@*/')()){ $("html").addClass("ie10"); }

继续阅读:https ://stackoverflow.com/a/13971998/1711038

于 2013-03-28T10:52:13.950 回答
0

自 jQuery v1.3 起, jQuery 的$.browser功能已被弃用。

对你来说更重要的是,在 1.9 版中,jQuery 删除了很多旧的不推荐使用的特性,包括这个。这就是它不适合你的原因。

如果您必须使用已弃用的旧功能,jQuery 开发人员确实提供了一个单独的迁移库,可以恢复所有旧功能。但它实际上只是用作短期的权宜之计;推荐的解决方案是修复您的代码,使其不使用旧功能。

不推荐使用 jQuery 的原因$.browser是因为浏览器检测被认为是不好的做法。几乎在每一种你想这样做的情况下,都有一种更好、更符合标准的方法来解决问题,而且浏览器越新,就越有可能出现这种情况——可以说是有充分理由的仍然对 IE6 等使用浏览器检测,但 IE10 是一个相当不错的浏览器,如果你真的遇到了无法克服的问题,我会感到惊讶。

有几种方法可以检测 IE10(我注意到你已经接受了一个答案),但老实说,我会说你最好找到你所遇到的样式问题的根本原因,并修复它,因为否则当 IE11 发布时,您将再次进行整个练习。

于 2013-03-28T11:08:26.477 回答
0

当您使用 ExtJS 时,为什么不使用它来解决问题呢?

ExtJS 3.4.0 无法识别 ie10,但有一个覆盖可用:https ://market.sencha.com/extensions/ext-isie10-for-extjs-3-x

那么你可以使用:

if (Ext.isIE10){
    Ext.fly(document.body.parentNode).addClass('ie10');
}

工作代码:

Ext.onReady(function () {
    // override v3.4.0 ie10 = ie6 bug
    // https://market.sencha.com/extensions/ext-isie10-for-extjs-3-x
    (function() {

        var ua = navigator.userAgent.toLowerCase();
        check = function(r) {
            return r.test(ua);
        },
            isIE10 = Ext.isIE && check(/msie 10/),
            isIE6 = Ext.isIE && !Ext.isIE7 && !Ext.isIE8 && !Ext.isIE9 && !isIE10;

        /**
         * True if the detected browser is Internet Explorer 6.x.
         * @type Boolean
         */
        Ext.isIE6 = isIE6;

        /**
         * True if the detected browser is Internet Explorer 10.x.
         * @type Boolean
         */
        Ext.isIE10 = isIE10;

    })();

    if (Ext.isIE10){
        Ext.fly(document.body.parentNode).addClass('ie10');
    }

});
于 2013-04-08T10:11:59.827 回答
0

如果您只对 IE 的浏览器检测感兴趣,那么我们使用以下似乎可行的方法。您可以通过传递正确的 ID 来更改要为其添加的 DIV。

    <!--[if IE 10]>
    <script  type="text/javascript">
        $(document).ready(function() {
            $("#ieFix").addClass("ie10");
        });
    </script>
<![endif]-->
于 2013-06-30T09:59:52.807 回答
0

布局引擎使用特征检测来确定浏览器/浏览器版本,并将适当的 css 类添加到 html 标记中。它检测 IE11、IE10、IE9、IE8 和 IE7,以及其他流行的浏览器,包括一些移动浏览器。http://mattstow.com/layout-engine.html

于 2013-10-11T01:54:58.097 回答