美文网首页
app内嵌h5页面:前端与原生语言的配合

app内嵌h5页面:前端与原生语言的配合

作者: 学浅知少 | 来源:发表于2019-01-26 17:18 被阅读0次

判断操作系统:

var u = navigator.userAgent,

app = navigator.appVersion;

var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g

var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

if(isAndroid) {//这个是安卓操作系统

}

if(isIOS) {//这个是ios操作系统

}

判断是移动端浏览器打开还是PC端浏览器打开:

if(/(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent)) {//移动端

//移动端打开

} else {

//pc端打开

}

判断微信、qq、还是微博内部打开(微信内置浏览器与qq内置浏览器 与微博内置浏览器 ):

function is_weixn_qq() {

    var ua = navigator.userAgent.toLowerCase();

    if(ua.match(/MicroMessenger\/[0-9]/i)) {

        $('#weixin-tip').show();//微信引导图(点击右上角按钮选择浏览器打开);

        return true;

    }

    if(ua.match(/QQ\/[0-9]/i)) {

        $('#weixin-tip').show();//qq引导图(点击右上角按钮选择浏览器打开);

        return true;

    }

     if (ua.match(/WeiBo/i) == "weibo") {

         //在新浪微博客户端打开

         return true;

     }

    return false;

}

日常功能的实现:进入页面时,根据不同情景后端会在当前页面url后面拼接参数,利用获取不同参数实现不同前端展示或逻辑。

获取当前url通用方法:

function getQueryString(name) {

    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");

    var r = window.location.search.substr(1).match(reg);

    if(r != null)

    return decodeURIComponent(r[2]);

    return null;

}

var a = getQueryString('a') ? getQueryString('a') : ''; //a为拼接的参数名

if(a == 1) {

    $('.myfooter').show();

    $('.box').css('padding-bottom', '1.4rem');

} else {

    $('.myfooter').hide();

    $('.box').css('padding-bottom', '0');

}

相关文章

网友评论

      本文标题:app内嵌h5页面:前端与原生语言的配合

      本文链接:https://www.haomeiwen.com/subject/ywiijqtx.html