判斷客戶端類型,Android,iOS,PC

在移動端開發的時候,有的時候咱們須要判斷客戶端是什麼類型的,安卓or蘋果?css

蘋果在狀態欄目和安卓不太同樣。android

//判斷是不是移動或是web
 var browser={  
    versions:function(){   
       var u = navigator.userAgent;
       //var app = navigator.appVersion;
       return {
               //移動終端瀏覽器版本信息
            trident: u.indexOf('Trident') > -1, //IE內核  
            presto: u.indexOf('Presto') > -1, //opera內核  
            webKit: u.indexOf('AppleWebKit') > -1, //蘋果、谷歌內核  
            gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐內核  
            mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否爲移動終端  
            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端  
            android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android終端或者uc瀏覽器  
            iPhone: u.indexOf('iPhone') > -1 , //是否爲iPhone或者QQHD瀏覽器  
            iPad: u.indexOf('iPad') > -1, //是否iPad    
            webApp: u.indexOf('Safari') == -1 //是否web應該程序,沒有頭部與底部  
        };  
     }(),  
    language:(navigator.browserLanguage || navigator.language).toLowerCase()  
}   
  
if(browser.versions.mobile || browser.versions.ios || browser.versions.android ||   
  browser.versions.iPhone || browser.versions.iPad){
      console.log("mobile application")
      window.location = "#";      
}else{
    console.log("web application");
}

咱們平時在用的時候可能不須要這麼多,就判斷一個ios or android 就好了ios

if(browser.versions.ios){
     console.log("ios");
    _ios.iosHeight();
}
else if(browser.versions.android){
        console.log("andriod");
        _android.addHeight();
    }else{
    console.log("不是移動設備");
}

在不一樣的客戶端執行不一樣的需求。咱們如今作的項目就須要在iOS上加上20的高度web

var fullHeight= function(e,b){
    var getH= e,
        selector= $(b),
        $win= $(window),
        fullH,
        containerH;
    // calculate height
    fullH= $win.height();
    containerH= parseInt(fullH-getH);
    //append to selector
    selector.css({
        overflow: 'auto',
        height: containerH+'px'
    });
}

var _ios={
    iosHeight:function(){
        fullHeight(64,'#i');
    }
    
}

這樣基本上均可以解決移動端的客戶端的判斷了瀏覽器

相關文章
相關標籤/搜索