JQuery Обнаруживать браузер IE9 и ниже и вызывать модификацию для обновления

Я хочу иметь возможность обнаруживать IE9 или менее с помощью jQuery (или если есть лучший метод?). Если версия браузера имеет IE9 или меньше, я хочу загрузить модальную версию с возможностью обновления до Chrome, FF и т.д.

Я читал, что $.browser больше не работает, поэтому просто интересно, как наилучшим образом добиться того, чего я хочу:

$(document).ready(function(){

   /* Get browser */
   $.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());

   /* Detect Chrome */
   if($.browser.chrome){
      /* Do something for Chrome at this point */
      alert("You are using Chrome!");

      /* Finally, if it is Chrome then jQuery thinks it 
       Safari so we have to tell it isn't */
       $.browser.safari = false;
  }

  /* Detect Safari */
  if($.browser.safari){
      /* Do something for Safari */
      alert("You are using Safari!");
  }

});

Ответ 1

Не используйте jQuery для обнаружения версий IE. Вместо этого используйте условные комментарии.

Почему? Хорошо подумайте, почему вы хотите настроить таргетинг на эти старые версии. Вероятно, потому, что они не поддерживают определенные функции JS/CSS, которые вам нужны. Так вы действительно хотите сохранить свой собственный JS-код, который, как вы уверены, будет работать в этих более старых версиях? Если вы идете по этому маршруту, вам нужно начать думать о том, будет ли код обнаружения, который вы пишете, работать в IE6 или 5 или 4... больно!

Вместо этого попробуйте следующее:

  • Добавьте свой код мода/баннер в свой HTML.
  • В основном файле css скрыть этот элемент с помощью display: none. Это гарантирует, что последние версии браузеров IE и IE не будут их видеть.
  • Создайте только IE файл css или js, который откроет этот элемент.
  • Включите этот файл в условные комментарии, предназначенные для нужных вам версий IE.

В приведенном ниже примере используется простое раскрытие с использованием CSS, но вы можете легко заменить его на JS, если хотите. Просто не делайте это слишком сложным или легко можете сломать ранние версии IE.

#index.html
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="main.css">
    <!--[if lte IE 9]>
      <link rel="stylesheet" type="text/css" href="ie-only.css">
    <![endif]-->
  </head>
  <body>
    <div class="ie-only">Go upgrade your browser!</div>
  </body>
</html>

#main.css
.ie-only { display: none }

#ie-only.css
.ie-only { display: block }

Вот полезная условная ссылка комментариев.

Ответ 2

var browser = {
        isIe: function () {
            return navigator.appVersion.indexOf("MSIE") != -1;
        },
        navigator: navigator.appVersion,
        getVersion: function() {
            var version = 999; // we assume a sane browser
            if (navigator.appVersion.indexOf("MSIE") != -1)
                // bah, IE again, lets downgrade version number
                version = parseFloat(navigator.appVersion.split("MSIE")[1]);
            return version;
        }
    };

if (browser.isIe() && browser.getVersion() <= 9) {

    console.log("You are currently using Internet Explorer" + browser.getVersion() + " or are viewing the site in Compatibility View, please upgrade for a better user experience.")
}

Ответ 3

var isIE9OrBelow = function()
{
   return /MSIE\s/.test(navigator.userAgent) && parseFloat(navigator.appVersion.split("MSIE")[1]) < 10;
}

Ответ 4

$. browser() удаляется в jquery version 1.9 используйте код ниже в script,

(function($) {

    var matched, browser;

    // Use of jQuery.browser is frowned upon.
    // More details: http://api.jquery.com/jQuery.browser
    // jQuery.uaMatch maintained for back-compat
    jQuery.uaMatch = function( ua ) {
        ua = ua.toLowerCase();

        var match = /(chrome)[ \/]([\w.]+)/.exec( ua ) ||
            /(webkit)[ \/]([\w.]+)/.exec( ua ) ||
            /(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) ||
            /(msie) ([\w.]+)/.exec( ua ) ||
            ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) ||
            [];

        return {
            browser: match[ 1 ] || "",
            version: match[ 2 ] || "0"
        };
    };
    // Don't clobber any existing jQuery.browser in case it different
    if ( !jQuery.browser ) {
        matched = jQuery.uaMatch( navigator.userAgent );
        browser = {};

        if ( matched.browser ) {
            browser[ matched.browser ] = true;
            browser.version = matched.version;
        }

    // Chrome is Webkit, but Webkit is also Safari.
        if ( browser.chrome ) {
            browser.webkit = true;
        } else if ( browser.webkit ) {
            browser.safari = true;
        }
        jQuery.browser = browser;
    }
})(jQuery);

Ответ 5

Скорректировано с Sitepoint:

if(navigator.appVersion.indexOf("MSIE 9.") !== -1)