3

オフライン モードでモバイル サファリと連携する Web サイトを開発しています。ホーム画面にブックマークして、そこから読み込むことができます。しかし、ホーム画面から開くと、特定のリンクをクリックするとアプリから飛び出し、モバイル サファリで開きます。

アプリは onclick イベント ハンドラーを<body>レベルでバインドします。イベント委任を使用して、任意のリンクのクリックをキャッチし、その href (「ヘルプ」または「レビュー」など) を調べ、JavaScript テンプレートを動的に呼び出してページを更新します。イベント ハンドラーはイベント オブジェクトで preventDefault() を呼び出します。一部のリンクではこれが機能し、ページはテンプレート出力で更新されます。ただし、テンプレートの結果を出力する前にローカル データベースにヒットするリンクについては、モバイル サファリでリンクが開かれます。

デスクトップ サファリでは、オフラインのときでもすべてのリンクが機能します。モバイル サファリ固有の何かが起こっています。

一部のリンクがオフラインで機能し、他のリンクが機能しない理由について何か考えはありますか? 問題のリンク URL はいずれもマニフェスト ファイルにリストされていませんが、リンク アクションが防止されているため、リストする必要はありません (すべきではありません)。

* モバイル サファリに読み込まれるリンクをクリックすると、オフラインであっても同じリンクが機能し、データベースからのデータが入力されたテンプレートが適切に機能するようになりました。つまり、ホーム画面から開くとリンクが失敗しますが、モバイル サファリ オフライン内からはリンクが失敗します * データベース ヒットを削除するようにリンクを変更すると (テンプレートにモック データベースの結果を入力することで)、問題が解決し、リンクをクリックできるようになります。ホーム画面からアプリで。

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() を呼び出すと、リンクはたどられず、モバイル サファリは開きません。そのリンク 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 に答える