使用jQuery检测Safari

时间:2011-05-05 14:52:46

标签: javascript jquery browser-detection

虽然两者都是基于Webkit的浏览器,但是在URL中的Safari urlencodes引号却没有。

因此我需要在JS中区分这两者。

jQuery's browser detection docs将“safari”标记为已弃用。

是否有更好的方法,或者我现在只是坚持使用已弃用的值?

14 个答案:

答案 0 :(得分:325)

混合使用feature detectionUseragent字符串:

    var is_opera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
    var is_Edge = navigator.userAgent.indexOf("Edge") > -1;
    var is_chrome = !!window.chrome && !is_opera && !is_Edge;
    var is_explorer= typeof document !== 'undefined' && !!document.documentMode && !is_Edge;
    var is_firefox = typeof window.InstallTrigger !== 'undefined';
    var is_safari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);

用法:
if (is_safari) alert('Safari');

或仅限Safari,请使用:

if ( /^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {alert('Its Safari');}

答案 1 :(得分:73)

以下标识Safari 3.0+并将其与Chrome区分开来:

isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/)

答案 2 :(得分:10)

不幸的是,上面的例子也会将android的默认浏览器检测为Safari,但事实并非如此。 我用了 navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1 && navigator.userAgent.indexOf('Android') == -1

答案 3 :(得分:7)

为了检查Safari我使用了这个:

$.browser.safari = ($.browser.webkit && !(/chrome/.test(navigator.userAgent.toLowerCase())));
if ($.browser.safari) {
    alert('this is safari');
}

它正常工作。

答案 4 :(得分:3)

显然,唯一可靠且被接受的解决方案是进行如下特征检测:

browser_treats_urls_like_safari_does = false;
var last_location_hash = location.hash;
location.hash = '"blah"';
if (location.hash == '#%22blah%22')
    browser_treats_urls_like_safari_does = true;
location.hash = last_location_hash;

答案 5 :(得分:2)

我找到的唯一方法是检查navigator.userAgent是否包含iPhone或iPad字

if (navigator.userAgent.toLowerCase().match(/(ipad|iphone)/)) {
    //is safari
}

答案 6 :(得分:1)

如果您正在检查浏览器,请使用$.browser。但是,如果您正在检查功能支持(推荐),请使用$.support

您不应使用$ .browser启用/禁用页面上的功能。原因是它不可靠,通常不推荐。

如果您需要功能支持,我建议modernizr

答案 7 :(得分:0)

通用功能

 var getBrowseActive = function (browserName) {
   return navigator.userAgent.indexOf(browserName) > -1;
 };

答案 8 :(得分:0)

解决这个问题的一个非常有用的方法是检测浏览器webkit版本并检查它是否至少是我们需要的版本,否则做其他事情。

使用jQuery,它是这样的:

"use strict";

$(document).ready(function() {
    var appVersion                  = navigator.appVersion;
    var webkitVersion_positionStart = appVersion.indexOf("AppleWebKit/") + 12;
    var webkitVersion_positionEnd   = webkitVersion_positionStart + 3;
    var webkitVersion               = appVersion.slice(webkitVersion_positionStart, webkitVersion_positionEnd);
	
    console.log(webkitVersion);

    if (webkitVersion < 537) {
        console.log("webkit outdated.");
    } else {
        console.log("webkit ok.");
    };
});

这为处理浏览器不同webkit实现的问题提供了安全且永久的修复。

快乐的编码!

答案 9 :(得分:0)

//Check if Safari
  function isSafari() {
      return /^((?!chrome).)*safari/i.test(navigator.userAgent);
  }
//Check if MAC
     if(navigator.userAgent.indexOf('Mac')>1){
        alert(isSafari());
     }

http://jsfiddle.net/s1o943gb/10/

答案 10 :(得分:0)

这将决定浏览器是否为Safari。

if(navigator.userAgent.indexOf('Safari') !=-1 && navigator.userAgent.indexOf('Chrome') == -1)
{
    alert(its safari);
}else {
    alert('its not safari');
}

答案 11 :(得分:0)

    // Safari uses pre-calculated pixels, so use this feature to detect Safari
    var canva = document.createElement('canvas');
    var ctx = canva.getContext("2d");
    var img = ctx.getImageData(0, 0, 1, 1);
    var pix = img.data;     // byte array, rgba
    var isSafari = (pix[3] != 0);   // alpha in Safari is not zero

答案 12 :(得分:0)

我用来检测Apple浏览器引擎,这个简单的JavaScript条件是:

 navigator.vendor.startsWith('Apple')

答案 13 :(得分:0)

我最好的解决方案

function getBrowserInfo() {
  const ua = navigator.userAgent; let tem;
  let M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
  if (/trident/i.test(M[1])) {
    tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
    return { name: 'IE ', version: (tem[1] || '') };
  }
  if (M[1] === 'Chrome') {
    tem = ua.match(/\bOPR\/(\d+)/);
    if (tem != null) {
      return { name: 'Opera', version: tem[1] };
    }
  }
  M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
  tem = ua.match(/version\/(\d+)/i);
  if (tem != null) {
    M.splice(1, 1, tem[1]);
  }
  return {
    name: M[0],
    version: M[1],
  };
}

getBrowserInfo();