Jak mogę wykryć Internet Explorer (IE) i Microsoft Edge za pomocą JavaScript?

82

Dużo się rozglądałem i rozumiem, że istnieje wiele sposobów wykrywania przeglądarki internetowej.

Mój problem jest następujący: mam obszar w moim dokumencie HTML, który po kliknięciu wywołuje funkcję JavaScript, która jest niezgodna z jakimkolwiek programem Internet Explorer. Chcę wykryć, czy używany jest IE, a jeśli tak, ustawić zmienną na true.

Problem w tym, że piszę swój kod z Notepad ++, a kiedy uruchamiam kod HTML w przeglądarce, żadna z metod wykrywania IE nie działa. Myślę, że problem polega na tym, że uruchamiam go z Notepad ++. Muszę być w stanie wykryć IE, aby na podstawie zmiennej wyłączyć ten obszar witryny. Próbowałem tego:

var isIE10 = false;

if (navigator.userAgent.indexOf("MSIE 10") > -1) {
    // this is internet explorer 10
    isIE10 = true;
   window.alert(isIE10);
}

var isIE = (navigator.userAgent.indexOf("MSIE") != -1);

if(isIE){
    if(!isIE10){
    window.location = 'pages/core/ie.htm';
    }
}

ale to nie działa. Jak mogę wykryć IE w Notepad ++? Z tego właśnie testuję HTML, ale potrzebuję metody, która będzie z tym działać.

edytować

Zauważyłem, że ktoś oznaczył to jako duplikat i jest to zrozumiałe. Przypuszczam, że nie było jasne. Nie mogę użyć odpowiedzi JQuery, więc nie jest to duplikat, ponieważ proszę o zwykłą odpowiedź JS.

Edytuj # 2

Czy istnieje również sposób na wykrycie przeglądarki Microsoft Edge?

Społeczność
źródło
2
Znacznie łatwiej będzie Ci sprawić, by kod działał w IE i innych przeglądarkach zamiast pisać kod specyficzny dla IE.
Ibu
1
Jeśli nie możesz po prostu naprawić swojej funkcji, aby działała w IE, to wykrywanie funkcji jest przez większość uważane za znacznie, znacznie lepszy sposób pisania kodu niż wykrywanie przeglądarki. Ponadto jest znacznie lepszy pod względem kompatybilności z przodu, gdy zmieniają się przeglądarki. Na przykład, czy wiesz już, co chcesz zrobić z Edge, najnowszą przeglądarką Microsoftu.
jfriend00
1
możliwy duplikat jQuery: sprawdź, czy użytkownik używa IE sprawdź link, istnieje wiele rozwiązań
num8er
Jeśli jedna z poniższych odpowiedzi odpowiedziała na Twoje pytanie, sposób działania tej witryny, „zaakceptowałbyś” odpowiedź, więcej tutaj: Co mam zrobić, gdy ktoś odpowie na moje pytanie ? Ale tylko wtedy, gdy rzeczywiście udzielono odpowiedzi na twoje pytanie. Jeśli nie, rozważ dodanie więcej szczegółów do pytania.
baao
Dodano wykrywanie krawędzi do mojej odpowiedzi, a także przydatny link, w którym można zobaczyć najnowsze wersje.
Sceptic

Odpowiedzi:

31

Nie wiem dlaczego, ale nie widzę „Edge” w userAgent, tak jak wszyscy mówią, więc musiałem obrać inną drogę, która może pomóc niektórym ludziom.

Zamiast patrzeć na navigator.userAgent, spojrzałem na navigator.appName, aby sprawdzić, czy jest to IE <= 10, czy IE11 i Edge. IE11 i Edge używają nazwy aplikacji „Netscape”, podczas gdy co druga iteracja używa „Microsoft Internet Explorer”.

Po ustaleniu, że przeglądarka to IE11 lub Edge, spojrzałem na navigator.appVersion. Zauważyłem, że w IE11 ciąg był dość długi i zawierał dużo informacji. Dowolnie wybrałem słowo „Trident”, którego zdecydowanie nie ma w navigator.appVersion dla Edge. Testowanie tego słowa pozwoliło mi rozróżnić te dwa.

Poniżej znajduje się funkcja, która zwraca wartość liczbową, w której znajduje się użytkownik Internet Explorer. Jeśli w Microsoft Edge zwraca liczbę 12.

Powodzenia i mam nadzieję, że to pomoże!

function Check_Version(){
    var rv = -1; // Return value assumes failure.

    if (navigator.appName == 'Microsoft Internet Explorer'){

       var ua = navigator.userAgent,
           re  = new RegExp("MSIE ([0-9]{1,}[\\.0-9]{0,})");

       if (re.exec(ua) !== null){
         rv = parseFloat( RegExp.$1 );
       }
    }
    else if(navigator.appName == "Netscape"){                       
       /// in IE 11 the navigator.appVersion says 'trident'
       /// in Edge the navigator.appVersion does not say trident
       if(navigator.appVersion.indexOf('Trident') === -1) rv = 12;
       else rv = 11;
    }       

    return rv;          
}
skribbz14
źródło
7
To zwraca 12 zarówno w Edge, jak i Firefox.
edencorbin
@edencorbin Poniżej zamieściłem odpowiedź, która rozwiązuje ten problem. stackoverflow.com/a/36688806/2304450
GavinoGrifoni
4
To nie działa. W Chrome, Opera, Firefox i (prawdopodobnie) Safari przyjmuje navigator.appName == "Netscape"wartość true.
Jack Giffin
2
TAK SAMO. Niepowodzenie w przeglądarkach Chrome, Opera, Firefox, Safari
BBaysinger
91

Oto najnowszy poprawny sposób, w jaki wiem, jak sprawdzić IE i Edge:

if (/MSIE 10/i.test(navigator.userAgent)) {
   // This is internet explorer 10
   window.alert('isIE10');
}

if (/MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent)) {
    // This is internet explorer 9 or 11
    window.location = 'pages/core/ie.htm';
}

if (/Edge\/\d./i.test(navigator.userAgent)){
   // This is Microsoft Edge
   window.alert('Microsoft Edge');
}

Zauważ, że nie potrzebujesz dodatkowego var isIE10 w swoim kodzie, ponieważ teraz wykonuje on bardzo szczegółowe sprawdzenia.

Sprawdź również tę stronę, aby uzyskać najnowsze ciągi agentów użytkownika dla przeglądarek IE i Edge, ponieważ ta odpowiedź może stać się nieaktualna w pewnym momencie: https://msdn.microsoft.com/en-us/library/hh869301%28v=vs.85%29. aspx

Sceptyk
źródło
2
FWIW, kiedy sprawdzam navigator.userAgentmoją maszynę wirtualną Win10 / Edge, otrzymuję tylko pierwszą jej część, która nie zawiera "Edge"ciągu.
Dave Newton
1
Której wersji Edge używasz i czy możesz zamieścić ją tutaj?
Sceptic
Używam VirtualBox 5.0.2 r 102096, a obraz nazywa się Microsoft Edge.Win10.For.Mac.VirtualBox.zip pobrany z witryny MS w poniedziałek 27 sierpnia 2015 r. Na tle pulpitu obrazu jest napisane Build 10240 , strona główna Edge mówi, że korzystam z „najnowszej kompilacji tej maszyny wirtualnej, 20150801 ”, pokazanej w Ustawieniach jako 20.10240.16384.0 .
Dave Newton
Dzięki i napis navigator.userAgent?
Sceptic
1
Jest zwracany jako „Mozilla / 5.0 (Windows NT 10.0; Win64; x64)” zamiast pełnego ciągu. IIRC Znalazłem kolejne pytanie SO dotyczące problemu z VM / obrazem.
Dave Newton
36
// detect IE8 and above, and Edge
if (document.documentMode || /Edge/.test(navigator.userAgent)) {
    ... do something
}

Wyjaśnienie:

document.documentMode

Właściwość tylko dla IE, po raz pierwszy dostępna w IE8.

/Edge/

Wyrażenie regularne do wyszukiwania ciągu „Edge” - który następnie testujemy pod kątem właściwości „navigator.userAgent”

Zaktualizuj marzec 2020 r

@Jam komentuje, że najnowsza wersja Edge jest teraz zgłaszana Edgjako agent użytkownika. Więc czek wyglądałby tak:

if (document.documentMode || /Edge/.test(navigator.userAgent) || /Edg/.test(navigator.userAgent)) {
    ... do something
}
Chris Halcrow
źródło
2
Jest to jedyna strona działająca dla mnie zarówno w przeglądarce IE, jak i Edge.
Meloman
1
/Edge\//.test(navigator.userAgent) Aby były bardziej solidne, wolę dołączyć odwrotny ukośnik.
jj
1
W najnowszej wersji Edge w agencie użytkownika jest tylko Edg. Aby przetestować pod kątem IE, Edge i Edge chromium, z uwzględnieniem ukośnika:document.documentMode || /Edge\//.test(navigator.userAgent) || /Edg\//.test(navigator.userAgent)
Jam
Przypuszczam, że nie musisz wykrywać Edge'a za pomocą ciągu znaków UA „Edg”, ponieważ jest oparty na Chromium i prawdopodobnie nie chciał być wykrywany (w przeciwieństwie do EdgeHTML)
Andrey
15

Używam UAParser https://github.com/faisalman/ua-parser-js

var a = new UAParser();
var name = a.getResult().browser.name;
var version = a.getResult().browser.version;
Oren Gal
źródło
2
Ogólnie wykrywanie funkcji jest lepsze niż wykrywanie przeglądarki. To powiedziawszy, jeśli naprawdę potrzebujesz wykryć przeglądarkę, użyłbym biblioteki (zgodnie z sugestią tutaj). Istnieje wiele zawiłości związanych z analizowaniem ciągów znaków agenta użytkownika, biblioteka zmniejszy ryzyko pomyłki.
sandstrom
Bardzo pomocny, żadne inne rozwiązanie nie działało, ta wtyczka działała idealnie dla mnie.
edencorbin
11

Temat jest trochę stary, ale ponieważ skrypty tutaj wykrywają Firefox jako fałszywie dodatni (EDGE v12), oto wersja, której używam:

function isIEorEDGE(){
  if (navigator.appName == 'Microsoft Internet Explorer'){
    return true; // IE
  }
  else if(navigator.appName == "Netscape"){                       
     return navigator.userAgent.indexOf('.NET') > -1; // Only Edge uses .NET libraries
  }       

  return false;
}

które oczywiście można napisać w bardziej zwięzły sposób:

function isIEorEDGE(){
  return navigator.appName == 'Microsoft Internet Explorer' || (navigator.appName == "Netscape" && navigator.userAgent.indexOf('.NET') > -1);
}
GavinoGrifoni
źródło
zwraca fałsz dla krawędzi
Cream Whipped Airplane
@CreamWhippedAirplane Czy możesz opublikować tutaj wynik działania navigator.appName nadany przez twoją wersję Edge? Może ostatnio to zmienili
GavinoGrifoni
@CreamWhippedAirplane wygląda na to, że się zmienili navigator.appVersion: teraz nie zawiera już „Trident”, ale zamiast tego poprawnie dodają „Edge” do nazwy. Aktualizuję teraz moją odpowiedź!
GavinoGrifoni
To nie zadziałało podczas testów na browserstack.com, nie wiem, czy działa na prawdziwej maszynie! Ale na browserstack otrzymałem Netscapejako appName ...
Betty St
4
Niepowodzenie dla IE 11. IE 11 podaje tylko „Netscape” jako nazwę aplikacji, a tym samym nie spełnia warunku
Ankur Aggarwal
8

Ta funkcja działała idealnie dla mnie. Wykrywa również Edge.

Oryginalnie z tego Codepen:

https://codepen.io/gapcode/pen/vEJNZN

/**
 * detect IE
 * returns version of IE or false, if browser is not Internet Explorer
 */
function detectIE() {
  var ua = window.navigator.userAgent;

  // Test values; Uncomment to check result …

  // IE 10
  // ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)';

  // IE 11
  // ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';

  // Edge 12 (Spartan)
  // ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';

  // Edge 13
  // ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586';

  var msie = ua.indexOf('MSIE ');
  if (msie > 0) {
    // IE 10 or older => return version number
    return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
  }

  var trident = ua.indexOf('Trident/');
  if (trident > 0) {
    // IE 11 => return version number
    var rv = ua.indexOf('rv:');
    return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
  }

  var edge = ua.indexOf('Edge/');
  if (edge > 0) {
    // Edge (IE 12+) => return version number
    return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
  }

  // other browser
  return false;
}

Następnie możesz użyć if (detectIE()) { /* do IE stuff */ }w swoim kodzie.

phocks
źródło
To zadziałało dla mnie w 2019 roku. Inne rozwiązania na tej stronie dały fałszywie pozytywny wynik dla Firefoksa lub nawet fałszywie negatywny dla IE 11.
Melissa Freeman
6

Jeśli chcesz tylko ostrzec użytkowników używających przeglądarki MS lub coś w tym stylu, ten kod powinien być dobry.

HTML:

<p id="IE">You are not using a microsoft browser</p>

JavaScript:

using_ms_browser = navigator.appName == 'Microsoft Internet Explorer' || (navigator.appName == "Netscape" && navigator.appVersion.indexOf('Edge') > -1) || (navigator.appName == "Netscape" && navigator.appVersion.indexOf('Trident') > -1);

if (using_ms_browser == true){
    document.getElementById('IE').innerHTML = "You are using a MS browser"
}

Dzięki @GavinoGrifoni

patchie
źródło
3

Dla mnie lepiej to:

var uA = window.navigator.userAgent,
    onlyIEorEdge = /msie\s|trident\/|edge\//i.test(uA) && !!( document.uniqueID || window.MSInputMethodContext),
    checkVersion = (onlyIEorEdge && +(/(edge\/|rv:|msie\s)([\d.]+)/i.exec(uA)[2])) || NaN;

Idź, biegnij: http://output.jsbin.com/solicul/1/ o http://jsfiddle.net/Webnewbie/apa1nvu8/

James Peter
źródło
2

Użyj tego wycinka: var IE = (navigator.userAgent.indexOf("Edge") > -1 || navigator.userAgent.indexOf("Trident/7.0") > -1) ? true : false;

Amin AmiriDarban
źródło
3
To zadziałało najlepiej dla mnie, chociaż trójskładnikowa operacja jest zbędna. navigator.userAgent.indexOf("Edge") > -1 || navigator.userAgent.indexOf("Trident/7.0") > -1wartościuje jako prawda lub fałsz, więc możesz to po prostu zwrócić / użyć.
Kolby
2

Jeden wiersz kodu do wykrywania przeglądarki.

Jeśli przeglądarka to IE lub Edge, zwróci wartość true;

let isIE = /edge|msie\s|trident\//i.test(window.navigator.userAgent)
shulha yahya
źródło
0

Oto klasa javascript, która wykrywa IE10, IE11 i Edge.
Obiekt Navigator jest wstrzykiwany do celów testowych.

var DeviceHelper = function (_navigator) {
    this.navigator = _navigator || navigator;
};
DeviceHelper.prototype.isIE = function() {
    if(!this.navigator.userAgent) {
        return false;
    }

    var IE10 = Boolean(this.navigator.userAgent.match(/(MSIE)/i)),
        IE11 = Boolean(this.navigator.userAgent.match(/(Trident)/i));
    return IE10 || IE11;
};

DeviceHelper.prototype.isEdge = function() {
    return !!this.navigator.userAgent && this.navigator.userAgent.indexOf("Edge") > -1;
};

DeviceHelper.prototype.isMicrosoftBrowser = function() {
    return this.isEdge() || this.isIE();
};
Tomas Prado
źródło
0

Jeśli musimy sprawdzić Edge'a, idź z tym

if (navigator.userAgent.indexOf ("Edge")> 1) {

//do something

}

prasanth pr
źródło
-4

Przede wszystkim na pewno nie jest to problem Notepad ++. To twój problem z dopasowywaniem ciągów

Wspólnym ciągiem znaków we wszystkich wersjach IE jest MSIE. Sprawdź różne ciągi userAgent na http://www.useragentstring.com/pages/Internet%20Explorer/

if(navigator.userAgent.indexOf("MSIE") != -1){
   alert('I am Internet Explorer!!');
}
Amit Prabhu Parrikar
źródło
próbowałem tego, to nie działa. Uruchomiłem kod z Notatnika ++ w IE i nie było żadnego alertu. Sprawdziłem konsolę debuggera i nie było żadnych błędów. Używam systemu Windows 7, nie jestem pewien, czy ma to wpływ na wersję IE
Jaka jest używana wersja IE?
Amit Prabhu Parrikar