2

1 つの HTMLで複数ページのアプリを考えると、各ページに JS で長い HTML コードと重いアニメーションを挿入する予定です。次のような HTML コード:

<div data-role="page" id="page11">
  ...
</div>
<div data-role="page" id="page12">
 <h2 id="anchor12">Title: Page 12</h2>
 <script>myScript12() // inject complex content to #anchor12</script>
</div>

1. いつmyScript12()解雇されますか? (.html ファイルを開くとき、または #page12 をクリックして開くとき ?

2. #page12 を別のページに移動すると、JS によって生成されたコンテンツはどうなりますか?

編集: 20 の重いページすべてを .html ロードでロードしたくありません。

解決策: Gajotres (JQM: document ready vs page events) による詳細な説明の +1 、以下は私の現在の解決策です。指定された data-role="page" が表示されている場合にのみ js を実行するには...

次の JQM HTML/JS を使用します。

<div data-role="page" id="page12">
 <h2 id="anchor12">Title: Page 12</h2>
 <script>
$('#page12').on('pageinit') { //only run when page is displayed
     myScript12() // inject complex content to #anchor12
});</script>
</div>
4

1 に答える 1

2

  1. そのスクリプトは、ページが に読み込まれるとすぐに実行されますDOM。そのため、ページ イベントが存在します。基本的に、コード実行の時間を計りたい場合は、ページ イベント内で行います。ページ イベントについて詳しく知りたい場合は、他の回答をお読みください: jQuery Mobile: document ready vs page events。

  2. ページを離れても、そのコンテンツはまだそこにロードされていDOMます。DOM大きなコンテンツを防ぎたい場合は、 pagehideイベントを使用して前のページ コンテンツを消去できます。DOMキャッシュを防ぐために data-role="page" div 内に配置できる属性もあります。属性名はです。data-dom-cache="true"詳細については、こちらを参照してください。

于 2013-05-16T21:09:38.287 に答える