33

オフラインで動作する HTML5 iPad アプリがあります。このアプリは、基本的に 4 つの html ファイルと 3 つの aspx ファイルで構成されています。私のキャッシュ マニフェストは、html ファイルのみをオフラインで使用できるように設定されており、aspx ファイルにはネットワーク接続が必要です。これはすべてうまくいっています！

今、私はアプリに最後の仕上げをし、ホーム画面のアイコンを完成させようとしているところまで来ました。フルスクリーンモードで実行するなどです。アプリがホーム画面に追加されたら、アプリを最初に全画面表示モードで起動します。タグが正しいと私が信じる理由は、html ページ間を行ったり来たりすると、アプリが (正しく) 起動し、全画面モードのままになるからです。私が抱えている問題は、サーバー (aspx) リンクの 1 つがクリックされたときに、アプリをフルスクリーン モードのままにすることです。

サーバー リンク (aspx) をクリックすると、Mobile Safari がフル ブラウザ モードで起動し、新しいウィンドウが開きます。この動作は受け入れられません。ここで何か単純なものが欠けていることを願っています。

すべてのページ (html + aspx) で使用しているメタ タグは次のとおりです。

  <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />

これにより、問題を理解するために必要なすべての情報が得られることを願っています。ここで、ホームページにブックマークされたページ以外のページが原因で、一部の人々が全画面モードを終了することを示す他のリンクを見ました。これは私が抱えている問題ではないので、新しい議論を始めたいと思いました。繰り返しますが、アプリにさらに 5 つの HTML ページがあれば、フルスクリーン モードのままになると思います。私の状況ではaspxページが問題です。

4

6 に答える 6

30

コンピュータに退屈な仕事をさせてください、それは彼らが作られているものです。

これは、すべてのリンクを書き直さないようにするために使用するJavaScriptコードの一部です。これにより、明示的な属性を持つリンクのみtarget = "_blank"がSafariで開きます。他のすべてのリンクはWebアプリ内に残ります。

var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++) {
    if(!a[i].onclick && a[i].getAttribute("target") != "_blank") {
        a[i].onclick=function() {
                window.location=this.getAttribute("href");
                return false; 
        }
    }
}
于 2011-09-12T15:59:21.540 に答える
18

役立つjQueryプラグインは次のとおりです：https ：//github.com/mrmoses/jQuery.stayInWebApp

これは同様のJavaScriptソリューションですが、さらにいくつかの機能があります。デフォルトではすべてのリンクにアタッチされますが、特定のクラスなどのリンクにアタッチするために使用できます。また、iOSのフルスクリーンモードを検出して、他のブラウザやデバイスの邪魔にならないようにします。

于 2011-10-20T19:59:15.713 に答える
8

私の経験では、外部リンクがあると、アプリが全画面表示モードから飛び出すようです。1 つの解決策は、javascript と location オブジェクトを使用してナビゲーションを管理することです。次のように：

HTML:

<a href="javascript:navigator_Go('abc.aspx');">Go</a>

Javascript:

function navigator_Go(url) {
    window.location.assign(url); // This technique is almost exactly the same as a full <a> page refresh, but it prevents Mobile Safari from jumping out of full-screen mode
}

このようにリンクを作り直さなければならないのは大変なことだと思いますが、それがあなたが直面している問題を解決する唯一の方法だと思います。

于 2011-07-20T08:57:41.647 に答える
3

KPMのソリューションの問題は、アプリのすべてのページのすべてのリンクが混乱し、特にアプリがajaxを多用する場合に、見つけにくいバグが発生することです。私はここgithubではるかに良い解決策を見つけました。

便宜上、以下のコードを複製しています。

(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');
于 2012-09-15T10:16:18.413 に答える
0

私が解決した解決策は、内部リンクを処理するためのウェイポイントです。これには、iOS 6 まで機能する外部リンク用の open() メソッドがあります。その後、iOS 7 用にこの別の修正が必要になります。

// Internal link handling
Waypoints
  .intercept('a')
  .ignore('a[rel=external], a[rel=blank], a[target=_blank], a[href$=".pdf"]');
  // .resume();

// External link handling...
$('a').on('click', function(e) {
  var href = $(this).attr('href');

  if ($(this).is('a[rel=external], a[rel=blank], a[target=_blank], a[href$=".pdf"]') || (href.indexOf('http') >= 0 && href.indexOf(document.location.host) === -1)) {
    e.preventDefault();
    var link = this;

    if (navigator.standalone) {
      if (/iP(hone|od|ad) OS 7/.test(navigator.userAgent)) {
        // iOS 7 external link polyfill
        e.stopPropagation();

        // Your custom dialog code for iOS 7 and external links
      }
      else {
        Waypoints.open(href);
      }
    }
    else {
      window.open(href);
    }
  }
});

チェックアウトする必要があるSwipy.jsもあります。ライブラリとして Waypoints が含まれています。価値がある場合は、このすべてのリンク処理と iOS 7 の修正を含めることができます。

于 2013-10-06T10:30:27.243 に答える