Comment détecter IE 8 avec jQuery?

102

Je dois détecter non seulement le type de navigateur, mais également la version en utilisant jQuery. La plupart du temps, j'ai besoin de savoir si c'est IE 8 ou non.

Je ne sais pas si je le fais correctement.

Si je fais :

if (jQuery.browser.version >= 8.0) {
dosomething}

Je ne suis pas sûr que cela fonctionnera pour la version 8.123.45.6 ou cela fonctionnera-t-il?

Edit: Notez que JQuery 2+ a abandonné la prise en charge d'IE8 et des versions antérieures, et ne peut donc plus être utilisé pour détecter IE8. Si vous utilisez une version actuelle de JQuery, il est nécessaire d'utiliser une solution Non-JQuery.

javascript jquery

— salmane
source

11

les réponses suggérées ci-dessous vous suggèrent d'utiliser jQuery.browser. Cependant, la documentation jQuery désapprouve l'utilisation de jQuery.browser. Au lieu de cela, ils vous suggèrent d'utiliser jQuery.support et de pointer vers une fonctionnalité qui n'est pas prise en charge pour marquer le navigateur. Par exemple, vous pouvez utiliser if (jQuery.support.opacity == false) {votre code IE8 et IE7}

— IberoMedia

Cela a jquery.support.opacityjuste fait ce que je voulais. Merci ...

— nrod

3

Passer à une réponse qui détecte de manière fiable des versions spécifiques , ne repose pas sur jQuery.browser, n'a pas besoin d'une bibliothèque supplémentaire comme Modernizr, et ne nécessite pas d'éditer le HTML (convient donc aux plugins, etc.) ...

— user56reinstatemonica8

Si vous faites les choses correctement, vous ne devriez presque jamais avoir besoin de détecter la version du navigateur. Il y a une raison pour laquelle cette fonctionnalité a été supprimée de jQuery, et cette raison est que la détection de la version du navigateur est une mauvaise pratique. L'utilisation de la détection de fonctionnalités à la place résoudra le problème dans presque tous les cas.

— Spudley

2

J'ai besoin de détecter IE8 car c'est le seul navigateur dont le moteur javascript est si lent qu'il affiche une boîte de dialogue qui dit "voulez-vous arrêter d'exécuter le script" sur cette page, et la valeur par défaut est "oui". S'il existe un mécanisme de détection de fonctionnalités pour cela, je vais l'utiliser. Sinon, c'est si navigateur == IE8. Je ne peux pas optimiser le javascript, car c'est le propre code de l'

— arborescence

79

Il est documenté dans la documentation de l' API jQuery . Recherchez Internet Explorer avec $.browser.msie, puis vérifiez sa version avec $.browser.version.

MISE À JOUR: $ .browser supprimé dans jQuery 1.9

La méthode jQuery.browser () est obsolète depuis jQuery 1.3 et est supprimée dans la version 1.9. Si nécessaire, il est disponible dans le cadre du plugin jQuery Migrate. Nous vous recommandons d'utiliser la détection de fonctionnalités avec une bibliothèque telle que Modernizr.

— AndiDog
source

si je fais: if (jQuery.browser.version> = 8.0) {dosomething} Je ne suis pas sûr que cela fonctionnera pour la version 8.123.45.6 ou cela fonctionnera-t-il?

— salmane le

13

C'est une chaîne, vous devriez donc le faire if(jQuery.browser.version.substring(0, 2) == "8.") { ... }. De cette façon, il fonctionnera avec toutes les versions d'IE8.

— AndiDog

13

jQuery.browserétait obsolète dans la version 1.3 et pourrait être déplacé vers un plugin à l'avenir. Voir la documentation jQuery.browser

— bendytree

Heureusement, il est toujours là et il n'y a aucune mention de dépréciation, @bendytree

— Alastair

47

jquery.browser est supprimé dans 1.9

— Mandeep Jain

173

Je pense que la meilleure façon serait la suivante:

À partir du passe-partout HTML5:

<!--[if lt IE 7]> <html lang="en-us" class="no-js ie6 oldie"> <![endif]-->
<!--[if IE 7]>    <html lang="en-us" class="no-js ie7 oldie"> <![endif]-->
<!--[if IE 8]>    <html lang="en-us" class="no-js ie8 oldie"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en-us" class="no-js"> <!--<![endif]-->

dans JS:

if( $("html").hasClass("ie8") ) { /* do your things */ };

surtout depuis qu'il $.browsera été supprimé de jQuery 1.9+.

— moi
source

11

C'est une manière très intelligente de détecter les versions d'IE. J'aime beaucoup!

— Greg

mais ne fonctionne pas si votre site Web est livré avec l'en-tête 'Content-type: application / xhtml + xml', que ces commentaires conditionnels sont ignorés

— philipp

1

Très intelligent ... mais il convient de noter que vous devez vérifier les classes actuelles ajoutées par les conditions dans HTML5BP. Pour le moment, je pense que la classe est lt-ie9AOTie8

— byronyasgur

2

@meo J'aime aussi cette implémentation. Mais y a-t-il une raison pour laquelle la classe est attachée au <html>lieu de <body>?

— repos

@meo Intéressant. Merci.

— repos le

89

Cela devrait fonctionner pour toutes les versions mineures d'IE8

if ($.browser.msie  && parseInt($.browser.version, 10) === 8) {
  alert('IE8'); 
} else {
  alert('Non IE8');
}

-- mettre à jour

Veuillez noter que $ .browser est supprimé de jQuery 1.9

— Mithun Sreedharan
source

56

N'oubliez pas que vous pouvez également utiliser HTML pour détecter IE8.

<!--[if IE 8]>
<script type="text/javascript">
    ie = 8;
</script>
<![endif]-->

Avoir cela avant tous vos scripts vous permettra de vérifier simplement la variable "ie" ou autre.

— TheBuzzSaw
source

4

Cette syntaxe prend également en charge les comparateurs "inférieur à" ("[if lt IE 7]") et "supérieur à" ("[if gt IE 8]").

— spiffytech

1

<! - [if lte IE 8]> pour inclure ie8

— user227353

1

C'est la meilleure façon de le faire, il suffit de rediriger vers une autre page qui indique "Pourquoi utilisez-vous IE8?" METTRE À JOUR MAINTENANT!

— Leon Gaban

2

Selon la norme actuelle, je leur demanderais pourquoi ils utilisent IE.

— TheBuzzSaw

Cela semble être la meilleure solution maintenant puisque JQuery 2.1.1 ne fonctionne pas avec IE8, et ne peut donc pas être utilisé pour détecter IE8!

— Dave

27

document.documentMode n'est pas défini si le navigateur n'est pas IE8,

il renvoie 8 pour le mode standard et 7 pour 'compatible avec IE7'

S'il s'exécute sous IE7, de nombreuses fonctionnalités css et dom ne seront pas prises en charge.

— Kennebec
source

9

Notez que IE9 renvoie 9. Cela devrait être une réponse plus votée, cependant, maintenant que $ .browser n'est plus une bonne solution. Essayez:if ((document.documentMode || 100) < 9) { // IE8

— Don McCurdy

if (document.documentMode! == undefined && document.documentMode == 8) {...}

— jpprade

Pour certaines applications où IE8 est encore très utilisé - à savoir les écoles américaines - l'approche de @ Don McCurdy est à la fois simple et efficace. En tandem avec Modernizr, cela fonctionne très bien.

— cbmtrx

Très bonne réponse! Cela renvoie les numéros de version pour IE8 à IE11 (par rapport à IE5 à IE9 pour les commentaires conditionnels - si quelqu'un a encore besoin de détecter de véritables IE7 ou IE6, vous devrez utiliser des commentaires conditionnels). Notez que selon les documents, il peut retourner 0pendant le chargement de la page - "essayez de déterminer le mode de compatibilité du document plus tard" (c'est-à-dire après que le document est prêt).

— user56reinstatemonica8

15

En supposant...

... que c'est le moteur de rendu crunky des anciennes versions d'IE que vous êtes intéressé à détecter, pour que le style apparaisse correctement dans l'ancien IE (sinon, utilisez la détection de fonctionnalités)
... que vous ne pouvez pas simplement ajouter des commentaires conditionnels au HTML - par exemple pour les plugins JS qui peuvent être appliqués à n'importe quelle page (sinon, faites simplement l'astuce des classes conditionnelles sur <body>ou <html>)

... alors c'est probablement la meilleure astuce (basée sur cette variante non-jQuery, légèrement moins flexible ). Il crée ensuite des tests pour puis supprime un commentaire conditionnel approprié.

(Les commentaires conditionnels sont ignorés dans le `` mode standard '' d'IE10 + - mais cela devrait être bien car le `` mode standard '' d'IE10 + n'a pas de moteur de rendu fou!)

Déposez cette fonction:

function isIE( version, comparison ){
    var $div = $('<div style="display:none;"/>');

    // Don't chain these, in IE8 chaining stops some versions of jQuery writing the conditional comment properly
    $div.appendTo($('body'));
    $div.html('<!--[if '+(comparison||'')+' IE '+(version||'')+']><a>&nbsp;</a><![endif]-->');

    var ieTest = $div.find('a').length;
    $div.remove();
    return ieTest;
}

Ensuite, utilisez-le comme ceci:

if(isIE()){ /* runs in all versions of IE after 4 before standards-mode 10 */ }

if(isIE(8)){ /* runs in IE8 */ }

if(isIE(9)){ /* runs in IE9 */ }

if(isIE(8,'lte')){ /* runs in IE8 or below */ }

if(isIE(6,'lte')){ /* if you need this, I pity you... */ }

Je suggérerais également de mettre en cache les résultats de cette fonction afin que vous n'ayez pas à la répéter. Par exemple, vous pouvez utiliser la chaîne (comparison||'')+' IE '+(version||'')comme clé pour stocker et vérifier le résultat de ce test dans un objet quelque part.

— user56reinstatemonica8
source

9

Remarque:

1) $ .browser semble être abandonné dans jQuery 1.9+ (comme noté par Mandeep Jain). Il est recommandé d'utiliser à la place .support .

2) $ .browser.version peut renvoyer "7" dans IE> 7 lorsque le navigateur est en mode "compatibilité".

3) À partir d'IE 10, les commentaires conditionnels ne fonctionneront plus.

4) jQuery 2.0+ abandonnera le support pour IE 6/7/8

5) document.documentMode semble être défini uniquement dans les navigateurs Internet Explorer 8+. La valeur renvoyée vous indiquera dans quel mode "compatibilité" Internet Explorer est en cours d'exécution. Ce n’est toujours pas une bonne solution.

J'ai essayé de nombreuses options .support (), mais il semble que lorsqu'un navigateur IE (9+) est en mode de compatibilité, il se comportera simplement comme IE 7 ... :(

Jusqu'à présent, je n'ai trouvé que cela fonctionne (genre-a):

(si documentMode n'est pas défini et que htmlSerialize et l'opacity ne sont pas pris en charge, alors vous regardez très probablement IE <8 ...)

if(!document.documentMode && !$.support.htmlSerialize && !$.support.opacity) 
{
    // IE 6/7 code
}

— Hanzaplastique
source

5

Si vous manipulez les versions de navigateur, cela ne mène souvent à rien. Vous ne voulez pas l'implémenter vous-même. Mais vous pouvez Modernizr créé par Paul Irish et d'autres personnes intelligentes. Il détectera ce que le navigateur peut réellement faire et mettra des classes appropriées dans l' <html>élément. Cependant, avec Modernizr , vous pouvez tester la version IE comme ceci:

$('html.lt-ie9').each() {
    // this will execute if browser is IE 8 or less
}

De même, vous pouvez utiliser .lt-ie8et .lt-ie7.

— koubic
source

3

Vous devriez également regarder jQuery.support . La détection des fonctionnalités est beaucoup plus fiable que la détection du navigateur pour coder vos fonctionnalités (à moins que vous n'essayiez simplement de consigner les versions du navigateur).

— jkyle
source

3

comment utiliseriez-vous jQuery.support pour détecter IE8?

— BishopZ

si AJAX est ce que vous recherchez, vous pouvez utiliser jQuery.support.ajax qui renvoie true si le navigateur prend en charge AJAX

— Jonathan Lin

Cette réponse devrait vous aider: stackoverflow.com/questions/1944169/…

— helgatheviking

3

Vous pouvez facilement détecter le type et la version du navigateur, en utilisant cette jquery

$(document).ready(function()
{
 if ( $.browser.msie ){
    if($.browser.version == '6.0')
    {   $('html').addClass('ie6');
    }
    else if($.browser.version == '7.0')
    {   $('html').addClass('ie7');
    }
    else if($.browser.version == '8.0')
    {   $('html').addClass('ie8');
    }
    else if($.browser.version == '9.0')
    {   $('html').addClass('ie9');
    }
 }
 else if ( $.browser.webkit )
 { $('html').addClass('webkit');
 }
 else if ( $.browser.mozilla )
 { $('html').addClass('mozilla');
 }
 else if ( $.browser.opera )
 { $('html').addClass('opera');
 }
});

— Sanooj
source

1

Voici le plugin de détection du navigateur Jquery pour identifier la détection du navigateur / système d'exploitation.

Vous pouvez l'utiliser à des fins de style après avoir inclus le plugin.

$("html").addClass($.os.name);
$("body").addClass($.browser.className);
$("body").addClass($.browser.name);

— Aravind Vel
source

0

Vous pouvez utiliser $ .browser pour détecter le nom du navigateur. les valeurs possibles sont:

webkit (à partir de jQuery 1.4)
safari (obsolète)
opéra
msie
Mozilla

ou obtenez un indicateur booléen: $ .browser.msie sera vrai si le navigateur est MSIE.

quant au numéro de version, si vous n'êtes intéressé que par le numéro de version majeure, vous pouvez utiliser parseInt ($. browser.version, 10). pas besoin d'analyser vous-même la chaîne $ .browser.version.

Quoi qu'il en soit, la propriété $ .support est disponible pour détecter la prise en charge de fonctionnalités particulières plutôt que de s'appuyer sur $ .browser.

— Yonatan Betzer
source