Это работает как талисман:
const getToDeleteEls = function(){ return document.querySelector(".to__delete"); }
let toDeleteEls = getToDeleteEls(), i = 0;
for(; i < toDeleteEls.length; i++){
toDeleteEls[i].addEventListener("click", deleteParent);
}
function deleteParent(event){
event.target.parentNode.parentNode.removeChild(event.parentNode);
}
(Примечание: функция getToDeleteEls должна позволять обновлять toDeleteEls всякий раз, когда добавляется новый элемент (поэтому мы можем добавлять слушателей во вновь созданные промежутки) - но с тех пор я понял, что мой выбор добавлять этих слушателей в цикл for (который также должен запускаться после каждого нового добавления) плох, потому что это создаст много избыточных слушателей. Поэтому я рекомендую пересмотреть эту часть - но ядро функциональность "Нажмите X, чтобы удалить" является твердой.)
Можно ли использовать индекс () метод, чтобы проверить, существует ли элемент в списке, таким образом, следующее работало бы?
var someDiv = $('#div');
$('a').click(function() {
if ($(this).parents().index(someDiv) >= 0) {
alert('boo');
}
}
Из #index ссылки.
Проверка (this).parents().index(someDiv) >= 0
, как @Gareth предполагает, будет работать просто великолепно.
Однако использование плагина родословной jQuery является путем быстрее / более эффективный.
Вдоль тех строк родители () дополнительно принимают сам селектор:
$('a').click(function() {
if ($(this).parents("#div").length) {
alert('boo');
}
});
Один путь состоял бы в том, чтобы использовать функцию фильтра
$('a').click(function() {
$(this).parents().filter(function() {
return this == someDiv[0];
}).each(function() {
alert('foo');
})
}
Я думаю, что можно также смочь сойти с рук использование jQuery.inArray
if ($.inArray( someDiv, $(this).parents() ) ) {
alert('boo');
}
Разве Вы не получили бы результат, который Вы хотите от простого использования селектора CSS?
$( '#div a' ).click( function() { ... } );
Попробуйте это:
var someDiv = $('#div');
$('a').click(function() {
if ($.inArray($(this).parents().get(), someDiv.get(0)) {
alert('boo');
}
}