Удалить родительский элемент после удаления последнего дочернего элемента - PullRequest
Новая
       6

Удалить родительский элемент после удаления последнего дочернего элемента

1 голос
/ 10 ноября 2009

У меня есть список элементов на странице, для обсуждения можно сказать, что у меня есть следующее: 

<div id="group_01">
  <div id="entry_1-01">stuff <a href="delete">x</a></div>
  <div id="entry_1-02">stuff <a href="delete">x</a></div>
</div>

<div id="group_02">
  <div id="entry_2-01">stuff <a href="delete">x</a></div>
  <div id="entry_2-02">stuff <a href="delete">x</a></div>
</div>

Ссылка удаления вызывает запрос Ajax и удаляет запись, после успешного вызова Ajax элемент div удаляется со страницы. Мой вопрос:

Как я могу удалить содержащий группу div после удаления всех его записей?

Надеюсь, это достаточно подробный вопрос. Я чувствую, что в этом нет ничего нового, но два дня поиска ничего не дали.

Ответы [ 4 ]

5 голосов
/ 10 ноября 2009

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

function d (x)
{
    var e = document.getElementById(x);
    var p = e.parentNode;
    p.removeChild (e);
    if (p.childNodes.length == 0) {
        var pp = p.parentNode;
        pp.removeChild (p);
    }
}

Я добавил клики к вашим элементам div следующим образом: 

<div id="group_01">
  <div id="entry_1_01">stuff 11<a onclick="d('entry_1_01');" href="#delete">x</a></div>
  <div id="entry_1_02">stuff 12<a onclick="d('entry_1_02');" href="#delete">x</a></div>
</div>

Я также изменил ссылку на "#delete". Вы можете привести это в порядок различными способами.

2 голосов
/ 10 ноября 2009

Функция, подобная этой, должна работать: 

function removeNodeIfEmpty(node) {
   var container = document.getElementById(node);
   var nodeCount = 0;

   for (i = 0; i < container.childNodes.length, i++) {
       if (container.childNodes[i].nodeType == 1) {
           nodeCount += 1;
       }
   }

   if (nodeCount < 1) {
     container.parentNode.removeChild(node);
   }
}

Это должно учитывать проблему пробелов.

1 голос
/ 10 ноября 2009

Если вы делаете что-то подобное, чтобы удалить запись: 

entryDiv.parentNode.removeChild(entryDiv);

тогда вы сможете использовать следующий код для удаления группы div при удалении последнего потомка: 

var groupDiv = entryDiv.parentNode;
groupDiv.removeChild(entryDiv);
if (!groupDiv.firstChild) {
    groupDiv.parentNode.removeChild(groupDiv);
}

... хотя вам нужно следить за текстовыми узлами только для пробелов, если эти записи не были созданы непосредственно скриптом.

0 голосов
/ 10 ноября 2009

Действительно зависит, какую библиотеку вы используете

http://docs.jquery.com/Traversing/parent#expr

должно быть подходящим выражением

...