AtoZ 時々 鬱な日記

[CMSD/jquery/js] CMSDにて、アイテムがない時にはその親要素を表示させないようにする

04. Webデザイン 2011年1月14日 金曜日 17:45:45

<article>
<h3>その他</h3>
<ul>
<cmsd:entrylist name="publications" design="default" rows="100">
<cmsd:group key="cat" value="4" />
</cmsd:entrylist>
</ul>
</article>

とある場合、エントリーが何も無くてもarticle、h3、ulまで表示されてしまう。
ので、
<article id="others">
<h3>その他</h3>
<ul>
<cmsd:entrylist name="publications" design="default" rows="100">
<cmsd:group key="cat" value="4" />
</cmsd:entrylist>
</ul>
</article>

と、article(親要素)に例えばidをあたえ、
cssで、
div#main section article#others{
display:none;
}

と非表示にしてやる。
そしてjqueryの以下のjsを読み込ませ、エントリがある場合(この場合はliがある場合)には、親のarticleにdisplayというクラスを与え、
$(document).ready(function(){
$("article#others:has(li)").addClass("display");
});

cssにて
div#main section article#others.display{
display:block;
}

displayクラスを表示させる。

Write comment