現在、Asp.net MVCとjQuery mobileを使用している小さなWebアプリケーションを作成しています。デスクトップのテスト環境とiPadのSafariブラウザですべてがうまく描画されています。しかし、私が頭に<meta name="apple-mobile-web-app-capable" content="yes" />
を追加すると、私はいくつかの奇妙な動作を開始します。私はリンゴ・モバイル・ウェブと「ホーム画面」アイコンからロードしようたびにクラッシュしていました最初のSafariでapple-mobile-web-app対応iOS Web Appの問題
<%@ Page Title="Test App" Language="C#" Inherits="System.Web.Mvc.ViewPage<TestApp.ViewModels.LoginViewModel>" %>
<!DOCTYPE html>
<html>
<head runat="server">
<meta charset="UTF-8" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-icon" sizes="72x72" href="../../../Content/Images/touch-icon-ipad.png" />
<!-- <link rel="apple-touch-startup-image" sizes="1024x748" href="../../../Content/Images/splash-screen-1024x748.png" />
<link rel="apple-touch-startup-image" sizes="768x1004" href="../../../Content/Images/splash-screen-768x1004.png" /> -->
<title>Test App</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script src="../../../Scripts/jquery.1.7.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<link rel="Stylesheet" href="../../../Content/jquery-mobile-fluid960.css" />
<link rel="Stylesheet" media="screen" href="../../../Content/mobile.css" />
<script type="text/javascript">
function BlockMove(event) {
// Tell Safari not to move the window
event.preventDefault();
}
</script>
</head>
<body id="login" ontouchmove="BlockMove(event);">
:ここ
は、以下の説明のための私の簡単なテスト用ログインページの先頭です-app-capable content = "yes"ですが、content = "no"または欠落した場合は表示されません。テストを通して、Safariがクラッシュすることなく奇妙なコードを読み込むスプラッシュ画像をコメントアウトした場合、私はそれを発見しました。サファリクロムは、それがすることになっているようになくなってしまうだけで、体内でこのテキストを表示します:それはページのタイトルと本文中に通常のテキストとして先頭からの私のjavascriptをリストアップしているためTest App function BlockMove(event) { // Tell Safari not to move the windowevent.preventDefault();} Mobile: Password:
これは奇妙です。その上にjavascriptやCSSは実行されていません(または表示されます)。以前のように、通常のiOS Safariブラウザやapple-mobile-web-app-capableが見つからない、またはnoに設定されていると、この動作は奇妙です。私は見つけたSafariのクラッシュログをいくつか持っていますが、ソースがないものとはあまり関係ないことを理解しています。
なぜこのようなことが起こったのかについての洞察は、私が迷っているので大いに感謝します。私は、同じ問題を抱えている誰かを見つけようとしている日々を探しています。うまくいけば、それは私が見落としている単純なものです。ありがとう。
ありがとうございます。私のテストのすべてがその可能性を指していたので、それはかなり面白いです。私はそれが通常のサファリではうまくいくが、家のアイコンからはうまくいかない理由を理解できなかった。私はその回避策を今日後で行っていくつもりです。 – PJH
最近のいくつかのテストからもう一つ興味深いことがあります。 ContentTypeをapplication/xhtml + htmlに戻して最終的に表示するには、<%:Html.TextBoxFor(model => model.LoginID)%> 'などのC#でコード化されたHTML要素を取得できます。もう一度これはweb-app-capableが存在し、yesに設定されている場合のみです。うまくいけば、これらの一方または両方がこの奇妙な行動を解決するのに役立ちます。 – PJH