最近替朋友放一個微信下載鏈接，通過二維碼掃描下載。
通過掃描二維碼下載APP已成為一個非常方便的方式，微信也成為掃描二維碼重要的工具，但是掃描后微信瀏覽器會對APK和appStore的鏈接進行屏蔽，導致用戶無法正常下載。
提供解決方案：1.使用騰訊應用寶；2.提示用戶使用瀏覽器打開。
參考了前端開發博客的一篇文章以及進行了改動。采用方案：彈出一個遮罩提示用戶在新的瀏覽器窗口打開。原文鏈接：http://caibaojian.com/weixin-tip.html
再也不用管微信如何的更新，直接判斷微信的ua，然后彈出一個遮罩提示用戶在瀏覽器中打開下載。並且不加關閉的按鈕。類似於下面這樣子：
這樣子用戶就只能在瀏覽器中打開，並且可以直接下載應用了。歡迎打開微信掃描查看（其他掃描沒有效果）。
演示：
作者已經將代碼上傳到github上了，你可以直接下載我的圖片和JS來用。github地址
如果這個代碼對你有用，希望你在下載時也點擊star一下。
版本三：jquery+css+div（雖然操作復雜，但實際上平時常用這種）。
如果你已經將它用在你的項目中了，歡迎留下你的在線地址哦。
另加一個判斷手機QQ的UA
function is_mobileQQ() { var ua = navigator.userAgent.toLowerCase(); if (ua.match(/\sQQ/i) == " qq" && /iphone/i.test(ua) == false) { return true; } else { return false; } }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"/> <title>微信彈出遮罩</title> </head> <body> <style type="text/css"> *{margin:0; padding:0;} img{max-width: 100%; height: auto;} .test{height: 600px; max-width: 600px; font-size: 40px;} </style> <div class="test"><a href="http://mp.weixin.qq.com/mp/redirect?url=http://mobile.xinlianwang.com/android/distributor/DistributorApp.apk#weixin.qq.com#wechat_redirect ">有效跳轉</a></div> <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.9.0/jquery.min.js"></script> <script type="text/javascript"> function is_weixin() { var ua = navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == "micromessenger") { return true; } else { return false; } } var isWeixin = is_weixin(); var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight; var weixinTip = $('<div id="weixinTip"><p><img src="live_weixin.png" alt="微信打開"/></p></div>'); if(isWeixin){ $("body").append(weixinTip); }else{ window.location.href="www.yishengqiao.com/1/DoctorBridge.apk"; } $("#weixinTip").css({ "position":"fixed", "left":"0", "top":"0", "height":winHeight, "width":"100%", "z-index":"1000", "background-color":"rgba(0,0,0,0.8)", "filter":"alpha(opacity=80)", }); $("#weixinTip p").css({ "text-align":"center", "margin-top":"10%", "padding-left":"5%", "padding-right":"5%" }); </script> </body> </html>
代碼：http://down.51cto.com/data/2200784