ページでコンテンツの表示/非表示機能を機能させようとしています:
<div>
<div class="t">
<h2><a href="#" class="sh" id="t1">-</a> Title 1</h2>
</div>
<section class="title1 title">
<div class="cat">
<p>Category 1<span>This is the first category</p>
</div>
<div class="cat">
<p>Category 2<span>This is the second category</p>
</div>
<div class="cat">
<p>Category 3<span>This is the third category</p>
</div>
</section>
</div>
かなりシンプルにまとめたと思います。基本的に、セクションごとに、このマークアップが繰り返されます。section
リンクをクリックすると、jquery は、リンクのコンテナー div とピア レベルにある を表示/非表示にする必要があります。
これが私が持っているものです。エラーは発生しませんが、セクションも非表示になりません。ただし、リンクのテキストは変更されます。
$(".sh").click(function() {
var show = ($(this).text() === "+");
if (show) {
$(this).parent("div").each("section", function() {$(this).fadeIn(500)});
}
else
{
$(this).parent("div").each("section", function() {$(this).fadeOut(500)});
}
$(this).text(show ? "-" : "+");
});
ここで根本的に重要な何かが欠けている可能性があると思うので、誰かが私が間違っていることを理解するのを手伝ってくれるなら、あなたの助けは大歓迎です.
ティア:)