【jQuery】PCとスマホのIEやGoogle chromeなどのブラウザをユーザーエージェントで判別する

プロモーションが含まれています

【jQuery】PCとスマホのIEやGoogle chromeなどのブラウザをユーザーエージェントで判別する

IEやGoogle chrome、Firefoxなどのブラウザをユーザーエージェントで判別し、処理を振り分ける方法、ついでにスマホ判別も

jQuery関連記事

関連記事をもっとみる

ユーザーエージェントを順番に判別していく

JavaScript

var UAPC = window.navigator.userAgent.toLowerCase();
if(UAPC.indexOf('msie') != -1 || UAPC.indexOf('trident') != -1) {
    var ua = 'IE';
} else if(UAPC.indexOf('edge') != -1) {
    var ua = 'Edge';
} else if(UAPC.indexOf('chrome') != -1) {
    var ua = 'Google Chrome';
} else if(UAPC.indexOf('safari') != -1) {
    var ua = 'Safari';
} else if(UAPC.indexOf('firefox') != -1) {
    var ua = 'FireFox';
} else if(UAPC.indexOf('opera') != -1) {
    var ua = 'Opera';
} else {
    var ua = '不明';
}

userAgent関数でブラウザのユーザーエージェントを取得します。
それにブラウザ判定しやすいようにtoLowerCase()で小文字に変換してます。

ユーザーエージェントの中にindexOfで判別用の文字列が含まれているかで判定しています。

IEの判別

IEの判別にはmsietridentが入っているかで調べれます。
Edgeの場合はedgeですね。

これで厄介なIEだけに追加処理ができるようになります。

バージョンの判定もできますが特に今回は必要なかったので調べてません。

スマートフォン、タブレットの判別

JavaScript

var UASP = window.navigator.userAgent.toLowerCase();
if(UASP.indexOf('iphone') != -1) {
    var ua = 'iPhone';
} else if(UASP.indexOf('ipad') != -1) {
    var ua = 'iPad';
} else if(UASP.indexOf('android') != -1) {
    if(UASP.indexOf('mobile') != -1) {
        var ua = 'android スマホ';
    } else {
        var ua = 'android タブレット';
    }
} 

これでスマホ、タブレットの判別ができます

コメント

タイトルとURLをコピーしました