Jquery: добавление данных в div ПОСЛЕ операции загрузки ajax

У меня установка примерно такая:

$('.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 closebutton перезаписывается содержимым stuff.html. Как заставить его ждать завершения операции ajax перед выполнением окончательного добавления?

Спасибо :)
Мала


javascript jquery ajax append
person Mala    schedule 19.12.2009    source источник

Ответы (2)


arrow_upward
8
arrow_downward

размещение 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>");
               });
});
person Anwar Chandra    schedule 19.12.2009

arrow_upward
4
arrow_downward

Используйте функцию обратного вызова [функция, вызываемая после завершения запроса ajax (не обязательно успешного)] для загрузки, а затем добавьте содержимое.

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

function AppendContent()
{
    // do your append function here
}
person rahul    schedule 19.12.2009