Jquery：在 ajax 加载操作后将数据附加到 div答案

【问题标题】：Jquery: Appending data to a div AFTER ajax load operationJquery：在 ajax 加载操作后将数据附加到 div
【发布时间】：2010-12-28 06:49:40
【问题描述】：

我的设置很像这样：

$('.container a').click(function(event) {
    event.preventDefault();
    $('#contents').remove();
    $(this).parent().append("<div id=\"contents\"></div>");
    $('#contents').html('<img src="/images/loading.gif" />')
                  .load("stuff.html")
                  .append("<div id=\"closebutton\"></div>");
});

但是，“附加”部分似乎在加载完成之前运行，因此关闭按钮 div 被 stuff.html 的内容覆盖。如何让它等到 ajax 操作完成后再执行最终追加？

谢谢:)
马拉

【问题讨论】：

标签： javascript jquery ajax append

【解决方案1】：

使用回调函数【ajax请求完成时调用的函数（不一定成功）】进行加载，然后追加内容。

$('#contents').html('<img src="/images/loading.gif" />')
                  .load("stuff.html",function() { AppendContent(); } )

function AppendContent()
{
    // do your append function here
}

【讨论】：

【解决方案2】：

将append 放入回调函数中会起作用。

$('.container a').click(function(event) {
    event.preventDefault();
    $('#contents').remove();
    $(this).parent().append("<div id=\"contents\"></div>");
    $('#contents').html('<img src="/images/loading.gif" />')
               .load('stuff.html',{},function(){
                  $(this).append('<div id=\"closebutton\"></div>");
               });
});

【讨论】：