javascript - JQuery 方法执行顺序？

Question

我正在尝试使用以下内容从特定的 <div> 加载数据来自包含 <ul><li> 的页面结构为 <div>在本页。目前正在发生的事情是“似乎”在数据存在之前尝试加载菜单。我这样说是因为我的菜单首先在页面上弹出 NULL ，这是默认设置，然后我期望的列表被填充到 <div id="hierarchy"> 中在我空的飞出菜单下。

我是 JQuery 的新手，所以希望这是一个简单、无知的错误。

<script type="text/javascript">
$(document).ready(function(){
    $('div.ms-quickLaunch').replaceWith('<div id="hierarchy" style="border:solid 1px white; width:0px;"></div>');
    });

$(function(){
            $('#hierarchy').load('http://wwcshare/icenter/Pages/wwcMenuContent.aspx #menuContent'); // grab content from another page
            $('#hierarchy').menu({
                    autoShow: true,
                    content: $('#hierarchy').next().html(),
                    backLink: false,
                    crumbDefaultText: ' '
                });         
        });
</script>

Answer 1

.load()异步运行，您需要调用任何依赖于它在 complete 回调中加载的内容的函数，如下所示:

$(function(){
  $('#hierarchy').load('http://wwcshare/icenter/Pages/wwcMenuContent.aspx #menuContent',
    function() {
      $(this).menu({
        autoShow: true,
        content: $(this).next().html(),
        backLink: false,
        crumbDefaultText: ' '
      });         
   });
});

在回调中，this 指的是您正在加载的元素，#hierarchy，因此您也可以将选择器保存在那里。