1

複数のHTMLページ、jquery、電話ギャップを備えたモバイルアプリを作成しています。アプリのページに同じフッターを重複してコピーして貼り付けたくなかったので、グローバルフッター.htmlを作成し、そのファイルのコンテンツを次のようなドキュメント.ready（）にロードしようとしました。

フッターHTML

<div data-role="navbar" data-grid="d">
    <ul class="apple-navbar-ui comboSprite">
        <li><a href="../dashboard.html">Home</a></li>
        <li><a href="../contacts/contacts.html">Contacts</a></li>
        <li><a href="../applications/applications.html">Applications</a></li>
        <li><a href="settings.html">My Account</a></li>
    </ul>
</div>

メインHTML

<div data-role="page">
    <div id="footer" data-role="footer">
    </div>
</div>

$(document).ready(function () {
   $('#footer').load("footer.htm");
   $('#footer').trigger('create');
});

footer.htmlのコンテンツをロードしますが、JquerymobileのUIはレンダリングされません。

しかし、ドキュメント対応コードをこれに変更したとき

$(document).ready(function () {
   $.get('footer.htm', function (retData) {
      $('#footer').append(retData);
      $('#footer').trigger('create');
   });
});

それはうまくいきました。

では、これら2つのアプローチの違いは何ですか？そして、なぜ1つは機能し、もう1つは失敗したのでしょうか。

4

3 に答える 3

4

実際の違いは、あなた$.get()にはコールバック関数があり、あなたにはコールバック関数を入れなかっ$('#footer').trigger('create');たのに、そこに置いたということです。.load()

あなたはこれをすべきだった：

$(document).ready(function(){
    $('#footer').load("footer.htm", function(){
        $(this).trigger('create');
    });
});
于 2013-01-12T08:24:17.783 に答える
4

メソッド間の違い：
.get()-すべてのコンテンツをロードします
.load()-部分的なコンテンツをロードできます$('#result').load('file.html #container');

于 2013-01-12T08:27:44.260 に答える
0

.load（）-サーバーからデータをフェッチする最も簡単な方法ですが、.get（）メソッドとは異なり、挿入するリモートドキュメントの一部を指定できます。「$( "#result" ).load( "ajax/test.html #container" );」のように

.get（）-HTTPGETリクエストを使用してサーバーからデータをロードします。サーバーからすべてのコンテンツをロードします。

于 2014-02-15T06:44:25.767 に答える