如何使用jQuery检测浏览器是否为Chrome?

问题描述 投票:55回答:11

我有一个问题,运行在chrome中的函数在Safari中正常工作,两个webkit浏览器......

我需要在Chrome的函数中自定义变量,但不能为Safari自定义变量。

遗憾的是,我一直在使用它来检测它是否是一个webkit浏览器:

if ($.browser.webkit) {

但我需要检测:

if ($.browser.chrome) {

有没有办法写一个类似的声明(上面一个的工作版本)?

jquery jquery-ui google-chrome jquery-selectors cross-browser
11个回答
106
投票
$.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase()); 

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

}

更新:(10倍至@ mar.Buckiegalope)

jQuery从1.9及其最新版本中删除了$.browser

但你仍然可以使用$ .browser作为一个独立的插件,找到here


1
投票
if(navigator.vendor.indexOf('Goog') > -1){
  //Your code here
}

0
投票

当我测试答案@IE时,我总是“真实”。更好的方法是@IE:

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

正如这个答案所述:https://stackoverflow.com/a/4565120/1201725


46
投票
if(/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())){
 alert('I am chrome');
}

11
投票

这个问题已在这里讨论过:JavaScript: How to find out if the user browser is Chrome?

请试试这个:

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

但是,由于IE11,IE Edge和Opera也会为true返回window.chrome,因此会有更完整和准确的答案。

所以使用以下内容:

// 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 
}

以上帖子建议使用jQuery.browser。但是jQuery API建议不要使用这种方法..(参见DOCS in API)。并声明其功能可能会在未来的jQuery版本中转移到团队支持的插件中。

jQuery API建议使用jQuery.support

原因是“jQuery.browser”使用了可以欺骗的用户代理,并且在jQuery的更高版本中实际上已经弃用了它。如果你真的想使用$ .browser ..这是独立jQuery插件的链接,因为它已从jQuery版本1.9.1中删除。 https://github.com/gabceb/jquery-browser-plugin

最好使用特征对象检测而不是浏览器检测。

此外,如果您使用Google Chrome检查器并转到控制台选项卡。输入“窗口”,然后按Enter键。然后,您就可以查看“窗口对象”的DOM属性。折叠对象时,您可以查看所有属性,包括“chrome”属性。

我希望这有帮助,即使问题是如何使用jQuery。但有时直接javascript更简单!


9
投票

用户无尽的是对的,

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

代码最好使用jQuery检测Chrome浏览器。

如果您使用IE并添加了GoogleFrame作为插件

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

代码将视为Chrome浏览器,因为GoogleFrame插件修改了navigator属性并在其中添加了chromeframe。


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

5
投票

userAgent可以更改。为了更健壮,请使用chrome指定的全局变量

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

1
投票

虽然它不是Jquery,但我自己使用jquery但是对于浏览器检测我已经在this page上使用了几次脚本。它会检测所有主流浏览器,然后检测一些。这项工作几乎都是为你完成的。


1
投票

遗憾的是,由于Opera的最新更新!!window.chrome(以及对窗口对象的其他测试)在Opera中测试时返回true。

Conditionizr为您解决了这个问题并解决了Opera问题:

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

我强烈建议使用它,因为以上都不是现在有效的。

这允许你这样做:

if (conditionizr.chrome) {...}

Conditionizr负责其他浏览器检测,并且比jQuery黑客更快更可靠。


1
投票

作为一个快速添加,我很惊讶没有人想到这一点,你可以使用in运算符:

"chrome" in window

显然这不是使用JQuery,但我想我已经把它放在了因为它没有使用任何外部库时很方便。

© www.soinside.com 2019 - 2024. All rights reserved.