H5前端与Android/ios的Js交互

第一种：网址拼接式

　　我们可以在网址后面拼接一个type，以获取地址上的type值来判断app端是安卓终端还是ios终端

　　type值：Android或ios

　　例如：http://www.ceshi.com/index.html?type=Android

　　我们先解析地址，下面是我经常用到的解析地址方法：

// 解析地址
function parseUrl(){
    var url=location.href;
    var i=url.indexOf('?');
    if(i==-1)return;
    var querystr=url.substr(i+1);
    var arr1=querystr.split('&');
    var arr2=new Object();
    for  (i in arr1){
        var ta=arr1[i].split('=');
        arr2[ta[0]]=ta[1];
    }
    return arr2;
}

调用解析方法

//js交互   无参数时
var type= parseUrl().type;
if(type==Android){
    window.unionCar.creat();
}else if(type==ios){
    window.open("creat()");  //方法名可以随便取
}

//js交互   有参数时
var type= parseUrl().type;
var id=1;
if(type==Android){
　　window.unionCar.creat(id);
 }else if(type==ios){ 
   window.open("creat("+id+")");  //方法名可以随便取
}

//注意：交互有参数时，ios方法需要将参数与方法拼接；

 

第二种：JS判断APP适配式

我们可以直接引用下面这段代码

var browser={
    versions:function(){
        var u = navigator.userAgent, 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()
}

调用解析方法

//交互无参数时
    var id=1;
    if(browser.versions.ios){
        window.open("gokhdetails()");//方法名可以随便起   
    }else if(browser.versions.android){
        window.unionCar.gokhdetails();//方法名可以随便起
    }

     //交互有参数时
    var id=1;
    if(browser.versions.ios){
        window.open("gokhdetails("+id+")");//方法名可以随便起  注：ios这里参数依旧需要字符串拼接   
    }else if(browser.versions.android){
        window.unionCar.gokhdetails(id);//方法名可以随便起
    }