5 способов исправить ошибку jQuery $ .browser не найдено

Итак, теперь официально объявлено, что функция $ .browser устарела . Что мы делаем? Не паникуйте. У меня есть 5 возможных решений, которые вы можете применить по своему усмотрению. Это GitHub Сообщение от репо говорит, что все это действительно:

«НЕТ ДЛИННОГО ПОДДЕРЖКИ» Этот репо не активен. Пожалуйста, используйте плагин jQuery Migrate, если требуется $ .browser, перепишите код или используйте usenavigator.userAgent напрямую ».

Так почему же был удален $ .browser?

Большинство разработчиков впервые подумали, когда начали видеть ошибки, и подумали: «Какого черта, почему был удален $ .browser?» Что ж, позвольте мне немного объяснить некоторые возможные причины этого. Поскольку $ .browser использует navigator.userAgent для определения платформы, он уязвим для подделки пользователем или искажения самим браузером . Всегда лучше полностью избегать специфичного для браузера кода. Свойство $ .support доступно для обнаружения поддержки определенных функций, а не для использования $ .browser .

Доступные флаги:

Решение 1 — Миграция JQuery

Используйте плагин jQuery Migrate для обновления более ранних версий jQuery до jQuery 1.9.x. Вот код переноса $ .browser во всей его красе:

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's 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; } // Warn if the code tries to get jQuery.browser migrateWarnProp( jQuery, "browser", jQuery.browser, "jQuery.browser is deprecated" ); [/js] Solution 2 - Use Modernizr Use Modernizr to utilise feature detection, HTML5/CSS3 etc... instead of basic browser detection. I think Modernizr is great!  Solution 3 - Use jQuery.Support Use the new $.support to utilise feature & bug detection. Once again jQuery does all the hard work and performs tests on browser and stores results on the jQuery.support object (every page load by default). We can then simple query this object to determine is a feature is available to use or not. For example to check for opacity support simply do this: [js] if (jQuery.support.opacity) { //opacity you may do... } 
 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's 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; } // Warn if the code tries to get jQuery.browser migrateWarnProp( jQuery, "browser", jQuery.browser, "jQuery.browser is deprecated" ); [/js] Solution 2 - Use Modernizr Use Modernizr to utilise feature detection, HTML5/CSS3 etc... instead of basic browser detection. I think Modernizr is great!  Solution 3 - Use jQuery.Support Use the new $.support to utilise feature & bug detection. Once again jQuery does all the hard work and performs tests on browser and stores results on the jQuery.support object (every page load by default). We can then simple query this object to determine is a feature is available to use or not. For example to check for opacity support simply do this: [js] if (jQuery.support.opacity) { //opacity you may do... } 
 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's 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; } // Warn if the code tries to get jQuery.browser migrateWarnProp( jQuery, "browser", jQuery.browser, "jQuery.browser is deprecated" ); [/js] Solution 2 - Use Modernizr Use Modernizr to utilise feature detection, HTML5/CSS3 etc... instead of basic browser detection. I think Modernizr is great!  Solution 3 - Use jQuery.Support Use the new $.support to utilise feature & bug detection. Once again jQuery does all the hard work and performs tests on browser and stores results on the jQuery.support object (every page load by default). We can then simple query this object to determine is a feature is available to use or not. For example to check for opacity support simply do this: [js] if (jQuery.support.opacity) { //opacity you may do... } 
 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's 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; } // Warn if the code tries to get jQuery.browser migrateWarnProp( jQuery, "browser", jQuery.browser, "jQuery.browser is deprecated" ); [/js] Solution 2 - Use Modernizr Use Modernizr to utilise feature detection, HTML5/CSS3 etc... instead of basic browser detection. I think Modernizr is great!  Solution 3 - Use jQuery.Support Use the new $.support to utilise feature & bug detection. Once again jQuery does all the hard work and performs tests on browser and stores results on the jQuery.support object (every page load by default). We can then simple query this object to determine is a feature is available to use or not. For example to check for opacity support simply do this: [js] if (jQuery.support.opacity) { //opacity you may do... } 

Решение 4 — Использование JavaScript / Ручное обнаружение

Определите браузеры и версии, используя следующие фрагменты кода JavaScript. Quirksmode имеет довольно обширный JavaScript-браузер / объект обнаружения устройств, который может оказаться полезным.

 /* Internet Explorer sniffer code to add class to body tag for IE version. Can be removed if your using something like Modernizr. */ var ie = (function () { var undef, v = 3, div = document.createElement('div'), all = div.getElementsByTagName('i'); while ( div.innerHTML = ' ', all[0]); //append class to body for use with browser support if (v > 4) { $('body').addClass('ie' + v); } }());  /* Internet Explorer sniffer code to add class to body tag for IE version. Can be removed if your using something like Modernizr. */ var ie = (function () { var undef, v = 3, div = document.createElement('div'), all = div.getElementsByTagName('i'); while ( div.innerHTML = ' ', all[0]); //append class to body for use with browser support if (v > 4) { $('body').addClass('ie' + v); } }()); 

Решение 5 — Профилактика / Информирование

Просто сообщите пользователю, что используемая им версия jQuery не поддерживает функцию $ .browser. Вероятно, не рекомендую это решение, так как оно ничего не делает для удобства использования, но может использоваться для блокировки определенных плагинов. Я бы предложил использовать версию плагина Migrate для разработчиков, которая включает информативную отладку .

 var undef; if ($.browser == undef) { message = []; message.push("WARNING: you appear to be using a newer version of jquery which does not support the $.browser variable."); message.push("The jQuery iframe auto height plugin relies heavly on the $.browser features."); message.push("Install jquery-browser: https://raw.github.com/jquery/jquery-browser/master/src/jquery.browser.js"); alert(message.join("n")); return $; } 

Источник: https://raw.github.com/house9/jquery-iframe-auto-height/master/release/jquery.iframe-auto-height.plugin.1.9.1.js

Как всегда, комментарии, предложения и улучшения приветствуются.