Обнаружение Safari с помощью jQuery
хотя оба являются браузерами на основе Webkit, Safari urlencodes кавычки в URL, а Chrome нет.
поэтому мне нужно различать эти два в JS.
документы обнаружения браузера jQuery пометить "safari" как устаревшее.
есть ли лучший метод или я просто придерживаюсь устаревшего значения на данный момент?
12 ответов
С использованием feature detection
и Useragent
строку:
var is_chrome = !!window.chrome && !is_opera;
var is_explorer= typeof document !== 'undefined' && !!document.documentMode && !isEdge;
var is_firefox = typeof window.InstallTrigger !== 'undefined';
var is_safari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
var is_opera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
использование:
if (is_safari) alert('Safari');
или только для Safari, используйте это:
if ( /^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {alert('Its Safari');}
следующее определяет Safari 3.0+ и отличает его от Chrome:
isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/)
к сожалению, приведенные выше примеры также обнаружат браузер по умолчанию android как Safari, чего не происходит.
Я
navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1 && navigator.userAgent.indexOf('Android') == -1
для проверки Safari я использовал это:
$.browser.safari = ($.browser.webkit && !(/chrome/.test(navigator.userAgent.toLowerCase())));
if ($.browser.safari) {
alert('this is safari');
}
Он работает правильно.
по-видимому, единственным надежным и принятым решением было бы сделать обнаружение функций следующим образом:
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;
единственный способ, который я нашел, - проверить, если navigator.userAgent содержит iPhone или iPad word
if (navigator.userAgent.toLowerCase().match(/(ipad|iphone)/)) {
//is safari
}
Если вы проверяете использование браузера $.browser
. Но если вы проверяете поддержку функций (рекомендуется), используйте $.support
.
вы не должны использовать $.браузера для включения/выключения функций на странице. Причина в том, что она не надежна и вообще просто не рекомендуется.
Если вам нужна поддержка, то я рекомендую modernizr.
общая функция
getBrowseActive = function (browserName) {
if (navigator.userAgent.indexOf(browserName) > -1)
return true;
return false;
};
//Check if Safari
function isSafari() {
return /^((?!chrome).)*safari/i.test(navigator.userAgent);
}
//Check if MAC
if(navigator.userAgent.indexOf('Mac')>1){
alert(isSafari());
}
очень полезный способ исправить это-обнаружить версию 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 браузера.
удачи в кодировании!
это определит, является ли браузер Safari или нет.
if(navigator.userAgent.indexOf('Safari') !=-1 && navigator.userAgent.indexOf('Chrome') == -1)
{
alert(its safari);
}else {
alert('its not safari');
}
// 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