1

複数のセクション (アコーディオン) 内に、段落と順序なしリスト (動的に生成) の組み合わせがあります。

私が達成しようとしているのは、空のタグ/一方または他方、または空の場合は両方を削除することです。'p' 要素と 'ul' 要素の両方が空の場合、その親の 'section' を削除します。

<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 に答える