2

皆様、さようなら。

jQuery モバイルについてもう少し知りたいと思ったので、昨日始めましたが、すでに最初の段階で行き詰っています。

私が達成しようとしていることは次のとおりです。

  • index.html の読み込み
  • index.html は pages/home.html にリダイレクトします

そうすれば、pages/home.html がデフォルトのページになります。これはどういうわけか可能ですか？現在、私はこれを持っています：

<body>
    <script>
    $(document).bind('pagecreate', function()
    {
        $.mobile.changePage("pages/home.html");
    });
    </script>
</body>
</html>

それは一種の奇妙な動作を示し、2回スライドしてエラーメッセージを表示します（ページを読み込めませんでした）。

すべてのページをページのサブディレクトリに配置したいと考えています。これは可能ですか、それとも不可能ですか？

ありがとう。

編集

もう一方のページには、本文に次の内容が含まれています。

<div data-role="page">

    <div data-role="header">
        <h1>Page Title</h1>
    </div>

    <div data-role="content">
        <p>Page content goes here.</p>
    </div>

</div>
4

2 に答える 2

2

イベントをドキュメントにバインドするために奇妙な動作が発生する可能性があり、ページが読み込まれるたびに pagecreate イベントが発生します。(1 回目は index から pages/home.html へ、2 回目は pages/home.html から pages/home.html へ) この問題を回避するには、このように index ページに id を設定し、イベントを # にバインドします。ドキュメントの代わりに indexPage。

<div data-role="page" id="indexPage">

<script type="text/javascript">
   $("#indexPage").bind('pagecreate', function()
   {
    $.mobile.changePage("pages/home.html");
   });
</script>

$.mobile.changePage() は、html がホスティング/ローカル サーバー (localhost) に配置されている場合にのみ機能することに注意してください。ファイルをサーバーに配置したくない場合。$.mobile.changePage() の代わりに window.location を使用する別の方法があります。$.mobile.changePage() は、ブラウザでページ全体を更新するのではなく、ajax を使用して html をロードすることにより、あるページから別のページにプログラムで変更されるためです。

<script type="text/javascript">
 $("#indexPage").bind('pagecreate', function()
 {
   window.location = "pages/home.html;
 });
</script>

詳細な手順については、http://demanstudio.blogspot.com/2013/02/change-pages-in-jquery-mobile.html を参照してください。

これがあなたを助けることを願っています。

于 2013-02-23T14:50:54.730 に答える
0

ここにindex.html

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
</head>
<body>
<script>
    $(document).bind('pagecreate', function()
    {
        $.mobile.changePage("home.html");
    });
    </script>

</body>
</html>

ここにhome.htmlがあります

<div data-role="page">

    <div data-role="header">
        <h1>Page Title</h1>
    </div>

    <div data-role="content">
        <p>Page content goes here.</p>
    </div>

</div>

ローカル サーバーで実行し、ブラウザーで直接開かないでください。正常に動作しています

于 2013-02-23T13:36:21.003 に答える