So erkennen Sie ein mobiles Ger?t mit jQuery

Das Erkennen, ob ein Benutzer von einem mobilen Ger?t aus auf Ihre Website zugreift, kann bei der Anpassung Ihrer Website hilfreich sein Inhalt oder Benutzererfahrung entsprechend anpassen. jQuery, eine beliebte JavaScript-Bibliothek, bietet eine M?glichkeit, diese Erkennung zu erreichen, aber ihre $.browser-Funktion wird nicht empfohlen, da sie begrenzte und m?glicherweise ungenaue Informationen liefert.

Stattdessen k?nnen Sie eine Kombination aus JavaScript und CSS verwenden um mobile Ger?te zu erkennen. Ein Ansatz besteht darin, die Eigenschaft navigator.userAgent zu verwenden, die Informationen über das Ger?t, den Browser und das Betriebssystem des Benutzers enth?lt. Indem Sie Ihre Ger?teerkennungslogik mit bekannten Werten in der Zeichenfolge navigator.userAgent abgleichen, k?nnen Sie feststellen, ob ein mobiles Ger?t verwendet wird.

Hier ist ein Beispiel, wie Sie dies mit einfachem JavaScript tun k?nnen:

if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
  // Some code for mobile devices
}

Um dies über jQuery zug?nglicher zu machen, k?nnen Sie es mit Folgendem kombinieren:

$.browser.device = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));

Dadurch wird das $.browser-Objekt um erweitert eine ?Ger?te“-Eigenschaft, die angibt, ob ein mobiles Ger?t verwendet wird.

Hinweis: Die enthaltene jQuery-Methode $.browser wurde in jQuery v1.9.1 entfernt. Wenn Sie diese Methode verwenden müssen, k?nnen Sie das jQuery-Migrations-Plugin installieren, das eine Kompatibilit?tsschicht für ?ltere jQuery-Versionen bereitstellt.

Ein gründlicherer Ansatz:

var isMobile = false; // Initialize as false
if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent) 
    || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0,4))) {
  isMobile = true;
}

Diese Version bietet einen gründlicheren Erkennungsmechanismus, der ein breiteres Spektrum mobiler Ger?te abdeckt.

Beachten Sie, dass die Verwendung der Benutzeragentenerkennung aus folgenden Gründen nicht für moderne Webanwendungen empfohlen wird seine Grenzen und Ungenauigkeiten. Erw?gen Sie, wenn m?glich, stattdessen die Funktionserkennung oder Medienabfragen.

Das obige ist der detaillierte Inhalt vonWie kann ich mit jQuery erkennen, ob sich ein Benutzer auf einem mobilen Ger?t befindet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!