Удалить DIV на Click

Question

У меня есть DIV, который я хочу удалить, когда я нажимаю ссылку, содержащуюся внутри этого DIV. Вот что у меня есть:

<div id="clients-edit-wrapper"> 
    <div class="close-wrapper"> 
     <a href="#" class="close-div">Close</a> 
    </div> 
</div> 

Когда я нажимаю «Закрыть» Я хочу clients-edit-wrapper быть удалены. Я ищу способ сделать это, указав родительский DIV ссылки Close, который в этом случае равен clients-edit-wrapper.

Любая помощь была бы принята с благодарностью!

---

Ответ от Huangism ниже:

$('.close-div').click(function(){ 
    $(this).parent().parent().remove(); 
}); 

Это работает только если элемент, который вы хотели бы удалить, два родителя до. В моем случае это именно то, что мне нужно.

Answer 1

учитывая ваш HTML разметки

Обновлен .on()

$('.close-div').on('click', function(){ 
    $(this).parent().parent().remove(); 
}); 

на самом деле используют этот метод ближе всего(), он является более надежным и более логично. При том, что вы можете обернуть более закрыть-ДИВ, и это не будет иметь значения

От ответа для Vision в

$(this).closest("#clients-edit-wrapper").remove(); 

больше гибкости

Редактировать
(Добавлены соответствующие ресурсы)
Пожалуйста, см JQuery документация по live()

Начиная с jQuery 1.7, метод .live() равен устаревшим. Используйте .on() до , присоедините обработчики событий. Пользователи более старых версий jQuery должны использовать .delegate() в предпочтении .live().

Насколько я знаю, это связано с проблемами памяти/проблемами с live().

Answer 2

$('#clients-edit-wrapper').find('.close-div').click(function(){ 
    $('#clients-edit-wrapper').remove(); 
}); 

Answer 3

Вот одно решение:

$(".close-div").on("click", function(event) { 
    $("#clients-edit-wrapper").remove(); 
    event.preventDefault(); 
}); 

Чтобы получить #clients-edit-wrapper элемент относительно .close-div элемента, вы можете использовать либо parent().parent() или closest с ID:

$(this).parent().parent().remove();     // will do 
$(this).closest("#clients-edit-wrapper").remove(); // the same 

Однако последний Безразлично Это имеет смысл, поскольку идентификаторы элементов страницы должны быть уникальными, и не будет другого #clients-edit-wrapper.

Answer 4

Вы также можете использовать closest.

$('.close-div').on('click', function(e) { 
    e.preventDefault(); 
    $('#clients-edit-wrapper').remove(); 
}); 

Answer 5

$(".close-div").click(function(){ 

    $("#clients-edit-wrapper").remove(); 

}); 

Answer 6

Поскольку вы основываете элемент от родителя, я поощрил бы событие делегирования:

$("#clients-edit-wrapper").on("click", ".close-div", function(e){ 
    e.preventDefault(); 
    $(e.delegateTarget).remove(); 
}); 

Answer 7

<div id="clients-edit-wrapper"> 
    <div class="close-wrapper"> 
     <a href="#" onclick="$('#clients-edit-wrapper').remove();" class="close-div">Close</a> 
    </div> 
</div>