1

在多个部分(手风琴)中,我有段落和无序列表(动态生成)的组合。

我想要实现的是删除空标签/一个或另一个,如果为空,则两者都删除。如果“p”和“ul”元素都为空,则删除其父“节”。

<section>
    <span>-</span>
    <h3>(a)Heading</h3>
    <div class="acc-box" style="display: block;">
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <ul></ul>
    </div>
</section>
<section>
    <span>-</span>
    <h3>(b)Heading</h3>
    <div class="acc-box" style="display: block;">
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <p></p>
        <ul>
            <li><a href="#" target="new.window">link</a></li>
            <li><a href="#" target="new.window">link</a></li>
            <li><a href="#" target="new.window">link</a></li>
            <li><a href="#" target="new.window">link</a></li>
        </ul>
    </div>
</section>
<section>
<span>-</span>
<h3>(d)Heading</h3>
<div class="acc-box" style="display: block;">
    <p>text here</p>
    <ul></ul>
</div>
4

2 回答 2

1

遍历每个部分并获取您感兴趣的元素。然后过滤它们以仅获取空的元素。如果两个集合的大小相同,则它们都是空的,您可以删除相应的部分。如果不是,则仅删除空元素。

$('.acc-box').each(function() {
    var $elements = $(this).children('p, ul'), // get all intersting elements
        $empty = $elements.filter(function() { // get empty ones
             return $.trim($(this).text()) === "";
        });

    if($empty.length === $elements.length) { // all are empty
        $(this).closest('section').remove(); // remove section
    }
    else {                                   // otherwise
        $empty.remove();                     // remove empty elements
    }
});

演示

于 2012-06-30T09:00:51.217 回答
0

嘿,你可以试试这个:http: //jsfiddle.net/qjyzc/

你也可以做同样的事情li

希望这会有所帮助,让我知道我是否错过了什么,

代码

$('p')
    .filter(function() {
        return $.trim($(this).text()) === ''
    })
    .remove()​
于 2012-06-30T08:52:49.943 回答