Mit der Popularität von Smartphones entscheiden sich immer mehr Benutzer dafür, Mobiltelefone zu verwenden, um sich auf Websites anzumelden. Bei der Website-Entwicklung müssen wir manchmal feststellen, ob sich der Benutzer über ein Mobiltelefon oder einen Computer anmeldet, um entsprechende Optimierungen und Anpassungen vorzunehmen. In diesem Artikel wird erläutert, wie Sie mithilfe von JavaScript feststellen, ob sich der Benutzer über ein Mobiltelefon anmeldet.
1. Erkennung durch Benutzeragenten
Wir können Browser- und Betriebssysteminformationen vom Benutzeragenten erhalten und feststellen, ob sie bestimmte Schlüsselwörter für mobile Browser enthalten. Um festzustellen, ob der Benutzer über ein Mobiltelefon angemeldet. Im Folgenden finden Sie allgemeine Informationen zum Benutzeragenten für mobile Browser: User-Agent-Informationen für Android-Geräte
Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0 Mobile/15E148 Safari/604.1 Mozilla/5.0 (iPad; CPU OS 14_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/86.0.4240.93 Mobile/15E148 Safari/604.1
Wir können reguläre Ausdrücke verwenden, um den User-Agent abzugleichen und festzustellen, ob er die Schlüsselwörter des mobilen Browsers enthält. Das Folgende ist der JavaScript-Code, um festzustellen, ob es sich um eine mobile Anmeldung handelt:
Mozilla/5.0 (Linux; Android 11; Pixel 5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.198 Mobile Safari/537.36
2. Erkennung anhand der Bildschirmauflösung
Normalerweise überschreitet die Breite von Mobiltelefonbildschirmen 768 Pixel nicht, während die Breite von Computerbildschirmen normalerweise größer als 1024 Pixel ist. Daher können wir feststellen, ob die aktuelle Bildschirmbreite weniger als 768 Pixel beträgt, um festzustellen, ob sich der Benutzer über ein Mobiltelefon anmeldet.
Das Folgende ist der JavaScript-Code, um festzustellen, ob es sich um eine Mobiltelefonanmeldung handelt:
function isMobile() { const ua = navigator.userAgent; const isIOS = /iPhone|iPad|iPod/i.test(ua); const isAndroid = /Android/i.test(ua); const isMobile = isIOS || isAndroid; return isMobile; }
Im obigen Code ermitteln wir die Breite des aktuellen Fensters und bestimmen, ob dies der Fall ist kleiner oder gleich 768 Pixel ist. Stellen Sie fest, ob sich der Benutzer über ein Mobiltelefon anmeldet.
3. Umfassende Nutzung
Die beiden oben genannten Methoden haben jeweils ihre eigenen Vor- und Nachteile, und Sie müssen sie entsprechend der tatsächlichen Situation auswählen. Normalerweise können wir zwei Methoden kombinieren, um die Genauigkeit der Beurteilung zu verbessern.
Das Folgende ist der JavaScript-Code, der die beiden oben genannten Methoden verwendet:
function isMobile() { const width = window.innerWidth; const isMobile = width <= 768; return isMobile; }
Im obigen Code erhalten wir die Benutzeragenteninformationen des Browsers und die Breite des aktuellen Fensters Verwenden Sie gleichzeitig reguläre Ausdrücke und die Bildschirmauflösung, um festzustellen, ob der Benutzer über ein Mobiltelefon angemeldet ist.
Zusammenfassung
Die Verwendung von JavaScript zur Feststellung, ob sich der Benutzer über ein Mobiltelefon anmeldet, kann uns dabei helfen, entsprechende Optimierungen und Anpassungen vorzunehmen, um das Benutzererlebnis der Website zu verbessern. In diesem Artikel werden zwei Beurteilungsmethoden vorgestellt, nämlich die Verwendung der Benutzeragentenerkennung und der Bildschirmauflösungserkennung, sowie deren umfassende Verwendung. Ich hoffe, dass dieser Artikel für alle Entwickler hilfreich sein kann.
Das obige ist der detaillierte Inhalt vonSo ermitteln Sie mithilfe von Javascript, ob es sich um ein Mobiltelefon-Login handelt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!