从网上搜到之前手机中判断App是否安装可以通过onblur事件+定时器来实现。
但现在要做这个功能时,按网上的说法已经不能实现了。因为现在浏览器中打开App,window不会触发onblur事件。
在尝试几次后发现,虽然window.onblur没有触发,但定时器仍然会停止,所以使用这个特点就尝试做了一个demo。
dome中包含2个页面,一个主页面,另一个用来打开App的页面:
主页面
<script type="text/javascript"> var log = function (msg) { $('body').append('<div class="log">' + msg + '</div>'); }; var tmCheck; function testApp(){ var $ifr = $('<iframe id="ifr"></iframe>') $ifr.attr('src', 'checkapp.html'); $('body').append($ifr); tmCheck = setTimeout(function(){ log('timeout, 未安装'); }, 3000); } function checkApp(state){ if( state == true ){ clearTimeout(tmCheck); return; } else { log('checkApp, 未安装'); } } </script> <button onclick="testApp();">Test</button>
checkApp.html
<script type="text/javascript"> function getSearchParam(key){ var result = window.location.search.match(new RegExp("(?:\?|&)" + key + "=([^&]*)")); return result ? result[1] : ''; } var ticket = getSearchParam('_'); if( ticket != '' ){ if( Date.now() - ticket < 2500 ){ window.parent.checkApp(false); } } else { setTimeout(function(){ var t = Date.now(); location.href = 'app打开协议://'; setTimeout(function(){ window.parent.checkApp(true); location.href = 'checkapp.html?_=' + t; }, 1500); }, 100); } </script>