web-dev-qa-db-fra.com

Comment détecter IE10 en utilisant javascript?

Comme beaucoup ont déjà posté dans d'autres questions (également dans la documentation jQuery), l'ancien jQuery.browser.version est obsolète et ne fonctionne que dans jquery1.3.

Connaissez-vous un autre moyen simple de le détecter, que je peux inclure dans mon code avant:

function handleInfoDivPopupVisibility(dynamicEleId, staticEleId){
var parentContainer = $('headerSummaryContainer');
var dynamicEle = $(dynamicEleId);
var staticEle = $(staticEleId);

if(isIE() && parentContainer){
    if (jQuery.browser.version != 10) { // I need to find a way to detect if it's IE10 here.
        parentContainer.style.overflow = 'visible'; 
    }
}
dynamicEle ? dynamicEle.style.display = '' : '';
if(dynamicEle && staticEle)
    gui_positionBelow(dynamicEle, staticEle);
}

Avant que vous ne disiez que c'est une question dupliquée de ceci ou ceci , j'aimerais insister sur le fait que je ne veux pas utiliser de hacks CSS. Y a-t-il un moyen de le détecter aussi simplement que je pouvais le faire auparavant?

if (jQuery.browser.version != 10) {...
12
periback2

En règle générale, il est déconseillé de vérifier la version du navigateur. Il est recommandé de vérifier les fonctionnalités du navigateur. Mais si vous êtes sûr de ce que vous faites:

function getIEVersion(){
    var agent = navigator.userAgent;
    var reg = /MSIE\s?(\d+)(?:\.(\d+))?/i;
    var matches = agent.match(reg);
    if (matches != null) {
        return { major: matches[1], minor: matches[2] };
    }
    return { major: "-1", minor: "-1" };
}

var ie_version =  getIEVersion();
var is_ie10 = ie_version.major == 10;

Nous avons le code suivant en production, il fonctionne donc et a été testé.

Et oui, nous avions besoin de détecter IE10, pas seulement une fonctionnalité particulière qui existe dans IE10, mais pas dans les versions précédentes.

17
J0HN

Internet Explorer possède la fonctionnalité Compilation conditionnelle ( http://www.javascriptkit.com/javatutors/conditionalcompile.shtml ). Vous pouvez utiliser ceci:

var isIE10 = false;
/*@cc_on
    if (/^10/.test(@_jscript_version)) {
        isIE10 = true;
    }
@*/
alert(isIE10);

DEMO: http://jsfiddle.net/X3Rvz/1/

Vous pouvez mettre ceci avant tout votre code JavaScript, et à partir de là, il vous suffit de référencer isIE10.

La compilation conditionnelle ne fonctionnera pas dans des environnements autres qu'IE, donc isIE10 restera toujours false. Et @_jscript_version ne commencera que par 10 dans IE 10.

Les commentaires conditionnels ne sont pas pris en charge dans IE 10 et la chaîne User-Agent peut être usurpée.

Comme la minification supprime généralement les commentaires, vous pouvez utiliser eval ou Function pour découvrir de la même manière:

var isIE10 = false;
if (Function('/*@cc_on return /^10/.test(@_jscript_version) @*/')()) {
    isIE10 = true;
}

DEMO: http://jsfiddle.net/wauGa/2/


UPDATE:

Pour toujours éviter la minification des commentaires mais aussi combiner la détection de toute version, vous pouvez utiliser quelque chose comme:

var IE = (function () {
    "use strict";

    var ret, isTheBrowser,
        actualVersion,
        jscriptMap, jscriptVersion;

    isTheBrowser = false;
    jscriptMap = {
        "5.5": "5.5",
        "5.6": "6",
        "5.7": "7",
        "5.8": "8",
        "9": "9",
        "10": "10"
    };
    jscriptVersion = new Function("/*@cc_on return @_jscript_version; @*/")();

    if (jscriptVersion !== undefined) {
        isTheBrowser = true;
        actualVersion = jscriptMap[jscriptVersion];
    }

    ret = {
        isTheBrowser: isTheBrowser,
        actualVersion: actualVersion
    };

    return ret;
}());

Et accédez aux propriétés telles que IE.isTheBrowser et IE.actualVersion (traduites à partir des valeurs internes des versions de JScript).

15
Ian

La version jQuery.browser.version fonctionne toujours, mais vous devez inclure le plug-in jquery-migrate.

http://api.jquery.com/jQuery.browser/https://github.com/jquery/jquery-migrate/#readme

3
Renier Cardoso

Voici une solution en une ligne pour détecter IE 10

var IE10 = navigator.userAgent.toString().toLowerCase().indexOf("trident/6")>-1;

et pour plus d’informations sur les autres versions et les navigateurs, veuillez vous référer à ceci Lien de Détection de navigateur

0
gulawaiz

La chaîne d'agent d'utilisateur IE10 dit

Toutefois, si votre site utilise toujours le reniflement agent-utilisateur, il est particulièrement intéressant de porter le jeton «MSIE» à «10.0». Pourquoi? Parce qu'il ajoute un chiffre supplémentaire à la valeur de chaîne du jeton. La plupart des sites gèrent cela sans effort, mais certains traitent le chiffre supplémentaire de manière incorrecte, ce qui les oblige à identifier IE10 comme IE1.

Pour illustrer ce propos, voici une expression régulière qui ne capture que le premier chiffre de la valeur du jeton «MSIE»:

// INCORRECT: will report IE10 version in capture 1 as "1"
var matchIE = /MSIE\s(\d)/;

Et voici celui qui capture toute la valeur du jeton «MSIE»:

// Correct: will report IE10 version in capture 1 as "10.0"
var matchIE = /MSIE\s([\d.]+)/
0
Mike Samuel

Je me suis retrouvé avec un problème (rayon de bordure sur le jeu de cadres avec légende) avec IE 9 à 11 (je n'ai pas coché IE 12).
MSIE n'est plus un agent utilisateur long dans IE 11 et appName est Mozilla. Cependant, trident est présent, j'ai réussi à extraire le numéro de version de trident et à le détecter.

if(navigator.appVersion.indexOf('Trident/')>-1){// Begin stupid IE crap
    var IE=navigator.appVersion;
    IE=IE.slice(IE.indexOf('Trident/')+8);
    IE=IE.slice(0,IE.indexOf(';'));
    IE=Number(IE);
    if(IE>=5&&IE<=7) // IE 9 through IE 11
        document.body.className='ie';
}    
0