web-dev-qa-db-fra.com

Comment détecter si un navigateur est Chrome utilisant jQuery?

J'ai un problème avec une fonction fonctionnant en chrome qui fonctionne correctement dans Safari, les navigateurs Webkit ...

Je dois personnaliser une variable dans une fonction pour Chrome, mais pas pour Safari.

Malheureusement, je l’utilise pour détecter s’il s’agit d’un navigateur Webkit:

if ($.browser.webkit) {

Mais j'ai besoin de détecter:

if ($.browser.chrome) {

Est-il possible d'écrire une déclaration similaire (une version de travail de celle ci-dessus)?

jqueryjquery-uigoogle-chromejquery-selectorscross-browser
55
TaylorMac
$.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase()); 

if($.browser.chrome){
  ............

}

UPDATE: (10x à @ M. Bacciagalupe)

jQuery a supprimé $.browser de 1.9 et leur dernière version. 

Mais vous pouvez toujours utiliser $ .browser en tant que plugin autonome, trouvé ici

106
Haim Evgi
if(/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())){
 alert('I am chrome');
}
44
adedoy

Cette question a déjà été abordée ici: JavaScript: Comment savoir si le navigateur de l'utilisateur est Chrome?

S'il vous plaît essayez ceci:

var isChromium = window.chrome;
if(isChromium){
    // is Google chrome 
} else {
    // not Google chrome 
}

Mais une réponse plus complète et plus précise serait la suivante: IE11, IE Edge et Opera renverront également true pour window.chrome.

Alors utilisez le ci-dessous:

// please note, 
// that IE11 now returns undefined again for window.chrome
// and new Opera 30 outputs true for window.chrome
// but needs to check if window.opr is not undefined
// and new IE Edge outputs to true now for window.chrome
// and if not iOS Chrome check
// so use the below updated condition
var isChromium = window.chrome;
var winNav = window.navigator;
var vendorName = winNav.vendor;
var isOpera = typeof window.opr !== "undefined";
var isIEedge = winNav.userAgent.indexOf("Edge") > -1;
var isIOSChrome = winNav.userAgent.match("CriOS");

if (isIOSChrome) {
   // is Google Chrome on IOS
} else if(
  isChromium !== null &&
  typeof isChromium !== "undefined" &&
  vendorName === "Google Inc." &&
  isOpera === false &&
  isIEedge === false
) {
   // is Google Chrome
} else { 
   // not Google Chrome 
}

Les articles ci-dessus conseillent d'utiliser jQuery.browser. Mais l'API jQuery recommande de ne pas utiliser cette méthode .. (voir DOCS dans API ). Et indique que ses fonctionnalités peuvent être déplacées vers un plugin pris en charge par une équipe dans une future version de jQuery.

L'API jQuery recommande d'utiliser jQuery.support . 

La raison en est que 'jQuery.browser' utilise l'agent utilisateur qui peut être spoofé et il est en réalité déconseillé dans les versions ultérieures de jQuery. Si vous voulez vraiment utiliser $ .browser .. Voici le lien vers le plugin autonome jQuery, car il a été supprimé de la version 1.9.1 de jQuery. https://github.com/gabceb/jquery-browser-plugin

Il est préférable d'utiliser la détection d'objet de fonctionnalité au lieu de la détection de navigateur. 

De même, si vous utilisez l'inspecteur Google Chrome et accédez à l'onglet Console. Tapez 'window' et appuyez sur enter. Ensuite, vous pourrez voir les propriétés du DOM pour «l'objet window». Lorsque vous réduisez l'objet, vous pouvez afficher toutes les propriétés, y compris la propriété 'chrome'. 

J'espère que cela aide, même si la question était de savoir comment faire avec jQuery. Mais parfois, le javascript direct est plus simple!

10
Jonathan Marzullo

Utilisateur sans fin a raison, 

$.browser.chrome = (typeof window.chrome === "object");

le code est préférable pour détecter le navigateur Chrome en utilisant jQuery.

Si vous utilisez IE et ajoutez GoogleFrame en tant que plugin, alors 

var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );

le code sera considéré comme un navigateur Chrome car le plugin GoogleFrame modifie la propriété du navigateur et y ajoute chromeframe.

9
Master

userAgent peut être changé. pour plus robuste, utilisez la variable globale spécifiée par chrome

$.browser.chrome = (typeof window.chrome === "object");
6
Endless
var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );
5
thinkdevcode

Malheureusement, en raison de la dernière mise à jour d'Opera !!window.chrome (et d'autres tests sur l'objet window), les tests dans Opera renvoient true.

Conditionizr s'occupe de cela pour vous et résout le problème Opera:

conditionizr.add('chrome', [], function () {
    return !!window.chrome && !/opera|opr/i.test(navigator.userAgent);
});

Je suggérerais fortement de l'utiliser car aucun des éléments ci-dessus n'est maintenant valide.

Cela vous permet de faire:

if (conditionizr.chrome) {...}

Conditionizr prend en charge les autres détecteurs de navigateur et est beaucoup plus rapide et fiable que les attaques jQuery.

1
Halcyon991

En guise d’ajout rapide, et je suis surpris que personne n’y ait pensé, vous pouvez utiliser l’opérateur in:

"chrome" in window

Évidemment, JQuery n’est pas utilisé, mais j’ai pensé que j’allais le dire car c’est pratique pour les moments où vous n’utilisez pas de bibliothèques externes.

1
Florrie

Bien que ce ne soit pas Jquery, j'utilise jquery moi-même mais pour la détection du navigateur, j'ai utilisé le script sur cette page plusieurs fois. Il détecte tous les principaux navigateurs, puis certains. Le travail est à peu près tout fait pour vous. 

1
stefgosselin

Quand je teste la réponse @IE, je suis toujours "vrai". Le meilleur moyen est-ce qui fonctionne aussi @IE:

var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);

Comme décrit dans cette réponse: https://stackoverflow.com/a/4565120/1201725

0
Bahadir Tasdemir
if(navigator.vendor.indexOf('Goog') > -1){
  //Your code here
}
0
Rafael Soteras