微信中调用手机默认浏览器实现文件下载的方案

现在微信分享的功能很多,从分享的链接下载apk安卓包是很正常的,但是微信不让下载apk包,只能通过浏览器来下载,但是这要给用户一个提示吧,不然用户不知道

 

qgma1402.png

下面我们来实现,引导用户通过浏览器来下载apk包

看下效果,图片在最下面

在需要下载的页面中加入下面的代码

  1.  

    <div class="weixin-tip" style="display:none;">

  2.  

    <p>

  3.  

        <img src="/images/weixin-tip.jpg" class="weixinpic" alt="微信打开"/>

  4.  

    </p>

  5.  

    </div>

css样式

  1.  

    a{text-decoration: none;}

  2.  

    .weixinpic{width: 100%; height: 100%;}

  3.  

    .weixin-tip{display: none; position: fixed; left:0; top:0; bottom:0; background: rgba(0,0,0,0.8); filter:alpha(opacity=80); height: 100%; width: 100%; z-index: 100;}

  4.  

    .weixin-tip p{text-align: center;}

js

  1.  

    <script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>

  2.  

    <script type="text/javascript">

  3.  

    $(function(){

  4.  

    var u = navigator.userAgent, app = navigator.appVersion;

  5.  

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

  6.  

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

  7.  

    $('.img').click(function(){

  8.  

    if(isAndroid){

  9.  

    var winHeight = $(window).height();

  10.  

    function is_weixin() {

  11.  

    var ua = navigator.userAgent.toLowerCase();

  12.  

    if (ua.match(/MicroMessenger/i) == "micromessenger") {

  13.  

    return true;

  14.  

    } else {

  15.  

    return false;

  16.  

    }

  17.  

    }

  18.  

    var isWeixin = is_weixin();

  19.  

    if(isWeixin){

  20.  

    $(".weixin-tip").css("height",winHeight);

  21.  

    $(".weixin-tip").show();

  22.  

    }else {

  23.  

    window.location.href = "";//安卓下载地址

  24.  

    }

  25.  

    }else if(isIOS){

  26.  

    location.href = '';//IOS下载地址

  27.  

    }

  28.  

     

  29.  

    })

  30.  

    })

  31.  

     

  32.  

    </script>

这要就可以下载了

展开阅读全文

没有更多推荐了,返回首页