4

JQuery Mobile は初めてです。JQuery Mobile を試してみたい Apache Wicket ベースのアプリケーションを持っているので、モバイル デバイスでより見栄えがよくなります。残念ながら、"Error Loading Page"JQuery Mobile に切り替える前は問題がなかったすべてのページ リンクでエラーが発生しています。根本的な原因は、HTTP 要求に含まれる URL にあるようです。JQuery Mobile 1.2.0、JQuery 1.8.0、Wicket 1.5.5 を使用し、jetty サーバー 6.1.26 と FireFox 16.0 を使用してローカルでテストしました。コード スニペットは次のとおりです。

        <ul data-role="listview" data-theme="b">
          <li><a href="#" wicket:id="metaprofileList" rel="external">List</a>
          </li>
        </ul>

対応する Java コード:

    add(new BookmarkablePageLink<MetaprofileListPage>(
            "metaprofileList", MetaprofileListPage.class));

上記に基づいて、Wicket はページがある実際の URL に正しく置き換えられ"#"たhref="#"ので、最終的な HTML は次のようになります。

        <ul data-role="listview" data-theme="b">
          <li><a href="com.alcatel_lucent.nms8770.awol.client.web.page.MetaprofileListPage" wicket:id="metaprofileList" rel="external">List</a>
          </li>
        </ul>

リンクがクリックされると、Jetty サーバーは次の URL で次の HTTP 要求を送信します。

GET http://127.0.0.1:7999/com.alcatel_lucent.nms8770.awol.client.web.page.MetaprofileListPage [HTTP/1.1 404 Not Found 0ms]

これは、MetaprofileListPage の正しい URL ではありません。JQuery Mobile に切り替える前に、同じシナリオでテストしました。同じ Jetty サーバーが正しい URL で次の HTTP 要求を送信します。

GET http://127.0.0.1:7999/wicket/bookmarkable/com.alcatel_lucent.nms8770.awol.client.web.page.MetaprofileListPage?7 [HTTP/1.1 200 OK 0ms]

私が行った唯一の変更は、HTML ファイルのヘッダーを次のように切り替えることでした。

<link rel="stylesheet" type="text/css" href="../../css/phone.css" media="only screen and (max-width: 480px)"/>
<link rel="stylesheet" type="text/css" href="../../css/default.css" media="only screen and (min-width: 1025px)"/>
<link rel="stylesheet" type="text/css" href="../../css/portrait.css" media="all and (max-device-width: 1024px) and (orientation:portrait)"/>
<link rel="stylesheet" type="text/css" href="../../css/landscape.css" media="all and (max-device-width: 1024px) and (orientation:landscape)"/>
<meta name="viewport" content="user-scalable=no, width=device-width"/>

標準のボイラープレート jquery mobile には以下が含まれます。

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />  
<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>  
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

私はこれに2週間苦労しています:-( JQuery Mobileが正しいURL/ページをロードするために何をする必要がありますか?助けてください!!どうもありがとう!!

4

1 に答える 1

0

ブックマーク可能なページは、次のような短いよく知られているセグメントの下にマウントする必要があります。

これは通常、次のようにApplication#initメソッドのオーバーライドで行います。

@Override
protected void init() {
    mountPage("/cheeses/${cheese}", CheesePage.class);
    mountPage("/profile", MyProfile.class);
}

これにより、少なくともこれらのパッケージ名が削除されます。

于 2013-07-01T11:44:48.360 に答える