web-dev-qa-db-fra.com

En Javascript, comment déterminer si mon navigateur actuel est Firefox sur un ordinateur par rapport à tout le reste?

if(firefox and is on a computer){
alert('using firefox on a computer')
}else{
alert("using something else!");
}

Comment puis-je faire ceci?

javascriptjquery
35
TIMEX

Ce que vous recherchez est connu sous le nom de détection de navigateur:

if ($.browser.mozilla) { ...

Cependant, le sniffing de navigateur est déconseillé, car il est facile de usurper l’agent utilisateur, c’est-à-dire de prétendre être un autre navigateur!

Vous feriez mieux d'utiliser la détection de fonctionnalités, soit à votre guise, soit via l'interface jQuery.support: http://api.jquery.com/jQuery.support/

Voici un article sur son extension pour votre propre usage: http://www.waytoocrowded.com/2009/03/14/jquery-supportminheight/

Modifier: 

J'ai aussi trouvé ce post qui aide: Lorsque IE8 n'est pas IE8, qu'est-ce que $ .browser.version?

52
James Wiseman

Je fais quelque chose comme ci-dessous;

function checkBrowser(){
    c = navigator.userAgent.search("Chrome");
    f = navigator.userAgent.search("Firefox");
    m8 = navigator.userAgent.search("MSIE 8.0");
    m9 = navigator.userAgent.search("MSIE 9.0");
    if (c > -1) {
        browser = "Chrome";
    } else if (f > -1) {
        browser = "Firefox";
    } else if (m9 > -1) {
        browser ="MSIE 9.0";
    } else if (m8 > -1) {
        browser ="MSIE 8.0";
    }
    return browser;
}
35
Fayyaz Ali

Comme ceci: Vérifiez pour Firefox. Ou un autre navigateur. 

 window.onload = function() {
          //  alert(navigator.userAgent);
            if (navigator.userAgent.indexOf("Firefox") > 0) {
                alert("ff");
            }
        }
12
poo
if (navigator.userAgent.indexOf("Firefox") != -1) {

 //some specific code for Mozilla

 }
5
David Castro
navigator.sayswho= (function(){
  var N= navigator.appName, ua= navigator.userAgent, tem;
  var M= ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i);
  if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) M[2]= tem[1];
  M= M? [M[1], M[2]]: [N, navigator.appVersion,'-?'];
  return M.join(' ');
 })();

comme son nom l'indique, c'est le navigateur qui dit que c'est - mais utilisez la détection d'objet avant de lui demander de faire quoi que ce soit ...

Je l'utilise pour enregistrer les erreurs des utilisateurs et pour tester le code de plusieurs navigateurs, où je connais les chaînes de userAgent.

4
kennebec

Comme déjà demandé dans un commentaire: pourquoi voulez-vous cela? La détection par navigateur est une mauvaise habitude et il n’ya que quelques situations où elle est nécessaire.

Au lieu de cela, utilisez la détection de fonctionnalité. Comme décrit par Nicholas Zakas , vous devriez tester des fonctionnalités relativement «peu communes» avant de les utiliser et vous fier uniquement à ces tests, vous êtes donc assez sûr. Par exemple, faire

if (window.XMLHttpRequest)
    var xhr = new XMLHttpRequest();

au lieu de

if ((brwsr.IE && brwsr.IE.version >= 7) || (brwsr.firefox) || (brwsr.opera))
    var xhr = new XMLHttpRequest();

Et aussi ne pas

if (window.XMLHttpRequest)
    // Hey, native XMLHttpRequest-support, so position: fixed is also supported

(à la place, teste si position: fixed est supporté)

Il existe plusieurs navigateurs inhabituels portant des noms tels que Kazehakase et Midori qui peuvent également ou non prendre en charge ces fonctionnalités, afin que vos scripts fonctionnent en mode silencieux lors de la détection de fonctionnalités.

Mais s'il vous plaît lisez le article mentionné , car il contient une très bonne explication détaillée de cette technique. (Au fait, je pense que Zakas ' JavaScript professionnel pour les développeurs Web est encore trop inconnu.)

1
Marcel Korpel

Il est préférable de détecter les fonctionnalités dont vous avez besoin, pas un navigateur. Par exemple, si vous avez besoin de savoir si foo () est supporté, vous pouvez le vérifier avec if (foo) {}

1
Sam Dark

http://api.jquery.com/jQuery.browser/

if ($.browser.mozilla) { ...
1
Franco

Vous pouvez effectuer le contrôle avec l’objet navigator.userAgent ou navigator de javascript en général,

Mais si vous voulez utiliser quelque chose de prêt à partir, vérifiez ceci:

http://www.quirksmode.org/js/detect.html

espérons que cela aide, Sinan.

1
Sinan

Toutes les solutions mentionnées ici ne sont pas sûres car l'agent ne fournit pas toujours le nom de navigateur correct en premier lieu. Si vous appelez une page avec chrome, vous avez également un safari dans l'agent. Cela signifie que si safari est la première chose à faire avec une requête if, alors vous avez le safari sur elseif si vous n'avez pas d'autreifif et seulement si alors la substitution est remplacée dans ce cas, safari. Cette solution n’est pas la plus sûre, mais il faut toujours le plus petit index pour obtenir le premier. L’opéra est l’inverse, l’opéra étant tout à fait à l’arrière de l’agent, les autres navigateurs peuvent donc différer.

/**
 * Description of Browser
 *
 * @author      Samet Tarim
 * @link        http://www.tnado.com/
 */    
var _MBT_Browser = {
    client: {},
    __init: function () {

        console.log('Init Browser...');

        _MBT_Browser.client.agent = navigator.userAgent;
        _MBT_Browser.set();
    },
    set: function () {

        var browsers = ["Firefox", "MSIE", "Trident", "Safari", "Chrome", "OPR"]; // Set the browser we want to detect
        _MBT_Browser.get(browsers);
        if (_MBT_Browser.client.current) {
            document.documentElement.setAttribute('data-useragent', _MBT_Browser.client.current); // Ad HTML tag data-useragent="IE"
        }
    },
    get: function (browser) {

        var index = '',
            i = 0,
            max = 0,
            min = 1000000; // to get the min value, we set first to million, is a placeholder for the first loop

        for (; i < browser.length; i++) {

            index = _MBT_Browser.client.agent.indexOf(browser[i]); // get index

            // Special case, we need here the largest index
            if (browser[i] === "OPR") {
                if (index > -1 && index > max) {
                    min = index;
                    _MBT_Browser.client.current = browser[i].toLowerCase();
                }
            } else {
            // We hold only the smallest index number and overwrite on smaller
                if (index > -1 && index < min) {
                    min = index;
                    _MBT_Browser.client.current = browser[i].toLowerCase();
                }
            }
        }
    }
};

Utilisation:

document.addEventListener('DOMContentLoaded', function () {
    _MBT_Browser.__init();
});

Et utilisez avec CSS pour styler sur le navigateur:

[data-useragent="firefox"] {
    /* Attribute has this exact value */
}
0
prod3v3loper