iOS6的Mobile Safari给前端开发者带来了什么 里已经提到iOS6的mobile safari将有智能应用通知标题（Smart App Banners）的功能，意在解决mobile safari里无法检测第三方应用安装状态的，通过这个功能，可以在页面中实现应用推荐类的需求。但目前来看，要实现这个需求只能在第三方应用中实现。思路也简单，第三方应用可以通过iOS的SDK提供的接口检测到对应的应用是否已经安装，然后在内嵌的UIWebView中打开的连接时追加参数如“?isinstalled=1”之类的参数供web页面获取来判断。web获知状态后可以提示给用户觖发的对应的应用的方案，如“打开应用”，“安装应用”等。
不过我们今天来说一种不借助第三方应用在mobile safari里就能实现跟上述类似的功能。
先来看看实现代码：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<body>
<div>
点击连接
<br />
如果已经安装网易新闻客户端将<font color=
"blue"
>打开对应新闻</font>
<br />
否则<font color=
"red"
>打开 APPSTORE</font>
<br />
</div>
<script language=
"javascript"
>
var
timeout;
function
open_appstore() {
}
function
try_to_open_app() {
timeout = setTimeout(
'open_appstore()'
, 300);
}
</script>
</body>
|
思路是：
1.连接的指向打开应用
2.onclick触发延时打开App Store下载应用页面
你可以保存以上代码进行测试。那为什么可实现呢？因为当你点击连接的同时是打开应用现时300ms后打开下载页面，如果应用成功打开生命周期就是激活状态，那么浏览器的状态是进入后台,页面里的所有操作都被注销了,显然timeout会被clear掉，但如果你没有成功打开应用即返回404，那么300ms到页面当然会自动跳转了。这里需要注意a元素的target不能是“_blank”，具体原因我想你已经知道了。
这种方式使用有两个缺点：
1.如果应用没有安装的话页面在跳转至App Store的同时会弹出打不开网址的提示。当然将连接协议改成itms-apps://可以避免
2.在设计过程中文案只能是“打开应用”之类，因为检测过程是由mobile safari自动实现的
有人会想到，可否通过new Image()的onload和onerror实现提前检测应用是否已经安装呢？答案是否定的，测试结果表明，这种方式即使应用已经安装还是会触发onerror。
1867
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
