2

この時点で、スライドトランジションを使用してchangePage（）を呼び出すと、ページ全体がスライドし、ヘッダーもスライドします。changePageでヘッダーが静的であり、ヘッダーのボタンとタイトルのみが変更されているが、ネイティブアプリとしてヘッダーが静的である可能性はありますか。

つまり、どこかで読んだことがありますが、JQMのページはAjaxによってローダーされています。しかし、私のアプリでは、ページがどのように完全に切り替わっているかがわかり、これは非常に弱いように見えます。

ヘッダーが静的でコンテンツのみが切り替えられているかのように、何らかの方法で切り替えを行うことは可能ですか？

4

1 に答える 1

2

これは changePage では不可能ですが、次のように content div に新しいコンテンツをロードすることができます:

    <div data-role="page" id="main_page">
      <div data-role="header">
        <h1 id="page_title">My Title Here</h1>
      </div>
      <div data-role="content">
        <div id="page_data">
            <button id="changepage">ChangePage</button>
          <h3>Some stuff</h3>
            <input type="text" value="sometext" /><br />
          <ul data-role="listview">
           <li>Some other stuff</li>
          </ul>
          </div>
      </div>
    </div>

次に、ページを変更する場合:

$("#page_title").html("New page title!");
$("#page_data").html("<h3>my awesome markup</h3>"); // this could come from ajax'ing
$("#page_data").trigger('create');

タイトル バーにあるボタンはすべて非表示にして表示する必要があることに注意してください。複数のコンテンツ div を作成し$.animate、 またはを使用して、新しいコンテンツを に移行でき$.fadeInます。

編集: これは実際の例です: http://jsfiddle.net/Y9PVC/2/ (現在、fadeOut と fadeIn を使用)。

于 2012-12-10T00:45:47.393 に答える