Удаление загруженного элемента jQuery AJAX

Question

Я работал над диалогом с контентом, загруженным AJAX, но я не могу его удалить. Обязательным требованием было наличие нескольких поддерживаемых с помощью php диалоговых окон с возможностью перетаскивания и закрытия.
(присутствует функция center ())

$('a.event').click(function() {
    var url = this.href;
    var getrel = $(this).attr('rel');
    var getid = $(this).attr('id');
    var dialog = $('<div id="event_'+getid+'" class="izModal '+getrel+'"></div>').appendTo('body');
    dialog.load( url, {}, function (responseText, textStatus, XMLHttpRequest) { $('#event_'+getid+'').append("<a class='close' rel='"+getid+"'>x</a>"); } ).center().draggable();
    return false;
});

И чтобы закрыть его:

        $('a.close').click(function(event){
            var getevent = $(this).attr('rel');
            $('#event_'+getevent+'').hide();
        });

Я пытался (как вы можете видеть) дать каждому диалогу идентификатор, чтобы закрыть его. Также пытался с this.parent , hide () , изменить CSS и remove () .

Может кто-нибудь заметить ошибку? Заранее спасибо.

Answer 1

Вы создаете ссылки динамически, вам нужно что-то вроде подхода .live(), например:

$('a.close').live('click', function(event){
  var getevent = $(this).attr('rel');
  $('#event_'+getevent+'').hide();
});

При использовании $('a.close').click() вы находите элементы, которые существуют , когда он запускается , новые элементы, которые будут созданы позже, не будут иметь обработчик click, .live() решает эту проблему, полагаясь на всплывающие события ... поэтому он работает с элементами, созданными позже.