jquery - .load() 和 $.get() 之间的区别

Question

我正在创建一个包含多个 HTML 页面、jquery 和 Phone gap 的移动应用程序。我不想在我的应用程序页面中重复复制粘贴相同的页脚，所以我创建了一个全局 footer.html 并尝试将该文件的内容加载到 documents .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 的内容，但不会呈现 Jquery 移动设备的 UI。

但是当我将文档就绪代码更改为此时

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

效果很好。

那么这两种方法有什么区别呢？为什么一个有效而另一个失败了？

Answer 1

实际上不同之处在于，在您的 $.get() 中，您有一个回调函数，并且将 $('#footer').trigger('create'); 放在那里 而在 .load() 中你没有放置回调函数。

你应该这样做:

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