Блог

У меня есть эта проблема, я генерирую окно (div с классом window) каждый раз, когда нажимается ссылка, это код для этого:

 $(".getWindow").live('click',function(){
    $('#desktop').append('<div class="window"><span class="close">x</span>Well ' $(this).attr('well') '<div id="screen"><img src="assembled_colors.jpeg" class="drag-image"  id="draggable"/></div></div>');
    $('.drag-image').draggable();
    $('.window').draggable();
});
  

Затем, каждый раз, когда нажимается «x» во второй строке моего кода, я пытаюсь закрыть окно, делая это:

 $('.close').live('click', function(){
    $(this).parent().empty();
});
  

Это закрывает только то, что находится внутри окна, но не само окно, мой следующий подход заключался в том, чтобы сделать это:

 $('.close').live('click', function(){
    $(this).parent().parent().empty();
});
  

Который закрывает все открытые окна. Не могли бы вы помочь мне, как закрыть только окно, содержащее нажатую кнопку x?

Заранее спасибо!

Попробуйте:

 $('.close').live('click', function(){
    $(this).parent().remove();
});
  

Причина использования remove() вместо empty() заключается в том, что empty() повлияет на то, что содержится в вашем родительском элементе, тогда как remove() удалит родительский элемент из DOM. Вот почему вы удаляете только содержимое внутри окна, а не само само окно.

.empty() просто очищает содержимое выбранного элемента.
.remove() удаляет элемент из DOM.

Я также предлагаю использовать closest , поэтому он все равно будет работать, если позже вы введете некоторые дополнительные элементы, которые переносят кнопку закрытия

 $('.close').live('click', function(){
    $(this).closest('.window').remove();
});
  

Вы должны изменить .empty() на .remove()

 $('.close').live('click', function(){
    $(this).parent().remove();
});