3

我正在开发一个可以在离线模式下与移动 Safari 一起使用的网站。我可以将其添加到主屏幕并从那里加载。但是,一旦从主屏幕打开,单击某些链接将跳出应用程序并在移动 safari 中打开——尽管我在所有链接点击时都使用了 preventDefault() !

该应用程序在<body>关卡上绑定了一个 onclick 事件处理程序。使用事件委托,它捕获对任何链接的任何点击,查看其href(例如“帮助”或“评论”),并动态调用javascript模板并更新页面。事件处理程序在事件对象上调用 preventDefault() - 对于某些链接这是有效的,并且页面会使用模板输出进行更新。但是,对于在输出模板结果之前导致本地数据库命中的链接,这些链接会在移动 safari 中打开。

在桌面 safari 中,即使我处于离线状态,所有链接也能正常工作 - 正在发生一些特定于移动 safari 的事情。

关于为什么某些链接可以离线工作,而其他链接不能工作的任何想法?清单文件中没有列出任何有问题的链接 URL,但它们不需要(不应该)列出,因为链接操作被阻止。

一些额外的奇怪之处: * 一旦我点击加载到移动 safari 中的链接,即使我处于离线状态,这些相同的链接现在也可以正常工作,并且填充了来自数据库的数据的模板可以正常工作。换句话说:链接在从主屏幕打开时失败,但不是从移动 safari 离线中打开 * 更改链接以删除数据库命中(使用模拟数据库结果填充模板)解决了问题,并且可以单击链接在主屏幕的应用程序中。

4

2 回答 2

5

你可能想看看这个:https ://gist.github.com/1042026

// by https://github.com/irae
(function(document,navigator,standalone) {
    // prevents links from apps from oppening in mobile safari
    // this javascript must be the first script in your <head>
    if ((standalone in navigator) && navigator[standalone]) {
        var curnode, location=document.location, stop=/^(a|html)$/i;
        document.addEventListener('click', function(e) {
            curnode=e.target;
            while (!(stop).test(curnode.nodeName)) {
                curnode=curnode.parentNode;
            }
            // Condidions to do this only on links to your own app
            // if you want all links, use if('href' in curnode) instead.
            if('href' in curnode && ( curnode.href.indexOf('http') || ~curnode.href.indexOf(location.host) ) ) {
                e.preventDefault();
                location.href = curnode.href;
            }
        },false);
    }
})(document,window.navigator,'standalone');
于 2011-07-14T11:47:30.483 回答
2

我让它工作,问题是由于事件处理程序代码中的一个看不见的错误(与阻止链接被跟踪无关)。如果您将点击事件的事件处理程序绑定到 body 标签,并调用 preventDefault(),则链接将不会被跟踪并且移动 safari 将不会打开,您可以定义自己的逻辑来根据该链接 url 更新页面.

您应该确保在可能发生任何错误之前调用 preventDefault() - 在我的情况下,问题是在调用 preventDefault() 之前事件处理程序中发生了错误,但是我当然看不到该错误控制台,因为该链接已被关注。

这是我正在使用的代码(它假定 DOM 标准事件并且在 IE 中会失败):

bodyOnClickHandler = function(e) {
    var target = e.target;
    if (target.tagName == 'A') {
        e.preventDefault();
        var targetUrl = target.getAttribute("href");
        //show the page for targetUrl
    }
}
于 2010-01-17T14:32:01.707 回答