Android-Handy über Javascript / jQuery erkennen

122

Wie würde ich feststellen, dass das verwendete Gerät ein Android für eine mobile Website ist?

Ich muss bestimmte CSS-Attribute auf die Android-Plattform anwenden.

Vielen Dank

javascript jquery android

— Xavier
quelle

223

Schauen Sie sich das an: http://davidwalsh.name/detect-android

JavaScript:

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");
if(isAndroid) {
  // Do something!
  // Redirect to Android-site?
  window.location = 'http://android.davidwalsh.name';
}

PHP:

$ua = strtolower($_SERVER['HTTP_USER_AGENT']);
if(stripos($ua,'android') !== false) { // && stripos($ua,'mobile') !== false) {
  header('Location: http://android.davidwalsh.name');
  exit();
}

Bearbeiten : Wie in einigen Kommentaren erwähnt, funktioniert dies in 99% der Fälle, aber einige Randfälle werden nicht behandelt. Wenn Sie eine viel fortschrittlichere und kugelsichere Lösung in JS benötigen, sollten Sie platform.js verwenden: https://github.com/bestiejs/platform.js

— Michael Lumbroso
quelle

5

Vergessen Sie nicht, auch nach Android-Tablets zu suchen

2

Es ist erwähnenswert, dass dies nicht immer für Android-Geräte funktioniert, da beispielsweise die Benutzerprogramme, die von Kindle Fire HD-Geräten gemeldet werden, das Wort "Android" überhaupt nicht enthalten.

— DJBP

3

Der navigator.userAgent-Ansatz funktioniert nicht auf Samsung Galaxy-Geräten. Es gibt kein "Android" in der Browserspezifikation.

— AsafK

2

Die ersten beiden Zeilen der JS-Lösung können vereinfacht werden:var isAndroid = /Android/i.test(navigator.userAgent)

— Dave Koo

4

Ihre Lösung funktioniert nicht. Hier ist ein Nokia Lumia User Agent. Und rate was? es passt als Android:

Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 625; Orange) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537

— Sam Jason Braddock

47

Wie wäre es mit diesem Einzeiler?

var isAndroid = /(android)/i.test(navigator.userAgent);

Der iModifikator wird verwendet, um eine Übereinstimmung ohne Berücksichtigung der Groß- und Kleinschreibung durchzuführen.

Technik aus dem Cordova AdMob-Testprojekt: https://github.com/floatinghotpot/cordova-admob-pro/wiki/00.-How-To-Use-with-PhoneGap-Build

— Mars Robertson
quelle

2

Ich denke, Michals Antwort ist die beste, aber wir können noch einen Schritt weiter gehen und ein Android-CSS gemäß der ursprünglichen Frage dynamisch laden:

var isAndroid = /(android)/i.test(navigator.userAgent);
if (isAndroid) {
    var css = document.createElement("link");
    css.setAttribute("rel", "stylesheet");
    css.setAttribute("type", "text/css");
    css.setAttribute("href", "/css/android.css");
    document.body.appendChild(css);
}

— drlarsen
quelle

1

Warum sollten Sie das tun, während Sie Medienabfragen verwenden können? Die Erkennung von JS-Geräten sollte nur zur Verbesserung dienen, z. B. zum Hinzufügen einer Einladung zur Installation Ihrer App. Das Rendern von Seiten sollte sich niemals darauf verlassen, da Sie Leistungsprobleme und eine schreckliche Benutzerfreundlichkeit haben.

— Camilokawerin

1

@camilokawerin Ihre Antwort sollte an den Autor gerichtet sein. Ich gab einfach eine Antwort auf seine Frage. Es gibt jedoch Fälle, in denen Sie plattformspezifisches CSS wünschen. Zum Beispiel, wenn der visuelle Stil der Benutzeroberfläche mit dem Gerät übereinstimmen soll.

— Drlarsen

2

;(function() {
    var redirect = false
    if (navigator.userAgent.match(/iPhone/i)) {
        redirect = true
    }
    if (navigator.userAgent.match(/iPod/i)) {
        redirect = true
    }
    var isAndroid = /(android)/i.test(navigator.userAgent)
    var isMobile = /(mobile)/i.test(navigator.userAgent)
    if (isAndroid && isMobile) {
        redirect = true
    }
    if (redirect) {
        window.location.replace('jQueryMobileSite')
    }
})()

— Phillip Senn
quelle

-3

js version, fängt auch iPad:

var is_mobile = /mobile|android/i.test (navigator.userAgent);

— jonny
quelle

3

Funktioniert nicht, weil es viele Geräte abfängt, nicht nur Android, wie es die Frage erfordert.

— NickG

1

Verwenden Sie mindestens so etwas: /android.*(?=mobile)/i.test(navigator.userAgent); Android-Handy zu erkennen. Da dieser reguläre Ausdruck jedoch "teure" Quantifizierer enthält, ist die Antwort von Philip mit zwei separaten Tests möglicherweise besser geeignet.

— Vadim P.