0

我将年份作为类别，将月份作为子类别。现在，当我单击年份时，我需要向下滑动月份，当我单击其他年份的特定年份时，月份应该被隐藏。

这是我的代码：

<div class="archiveevnt">
<h2 class="subhead3">2012</h2>
<ul class="event1">
<li>Feb</li>
<li>Mar</li>
</ul>
</div>
<div class="archiveevnt">
<h2 class="subhead3">2013</h2>
<ul class="event1">
<li>Jan</li>
<li>Feb</li>
<li>Mar</li>
</ul>
</div>
<script type="text/javascript">
    $(document).ready(function(){
        $('h2.subhead3').next('ul.event1').slideToggle();
        $('h2.subhead3').click(function(){
            $('h2.subhead3').next('ul.event1').slideUp();
            $(this).next('ul.event1').slideToggle();
            return false;
        })
    })
</script>

我的问题是当我单击年月向下滑动时，现在当我再次单击同一年月时不会向上滑动。感谢您的任何帮助或建议。

4

2 回答 2

1

你只需要替换这行代码：

$('h2.subhead3').next('ul.event1').slideUp();

有了这个：

$('h2.subhead3').not(this).next('ul.event1').slideUp();
  • $('h2.subhead3').not(this)将选择subhead3除当前范围内单击的元素之外的所有年份元素。
  • 此外，由于您使用slideUp的是所有subhead3年份元素，然后slideToggle是当前元素。它导致单击同一年的月份不会向上滑动，而是向上滑动然后再次向下滑动的行为。

小提琴演示

于 2013-06-17T08:42:37.463 回答
0

您需要删除下面额外的代码行。

$(this).next('ul.event1').slideUp();

下面是完整的工作代码

$(document).ready(function(){ $('h2.subhead3').next('ul.event1').slideToggle(); $('h2.subhead3').click(function(){ $( this).next('ul.event1').slideToggle(); return false; }) })
于 2013-06-17T08:54:16.930 回答